FlexiGrid插件的使用(ASP项目)
今晚看了几篇项目应用的博客感受很深,晚上怎么都睡不着觉。于是乎,下面的博客诞生了 ^-^。
我在想是不是要把我熟悉的Spring.NET框架与别的框架或技术结合起来。由于心血来潮,斗胆在园子里这么多大牛的面前班门弄斧了。长话短说,下面是我项目中用到的技术(图1):
1.JQuery的FlexiGrid插件
2.ASP.NET MVC
3.NVelocity 目前没有与MVC结合,只是用来简单的替换模板
4.WCF
5.LINQ
6.NHibernate
(图1)
这个项目目前版本是V1.0版本,我以后会定期更新这个项目。该项目包含了18个类库(图2)。我后续会更新这篇文章和代码,试图打造一套完美的解决方案。
(图2)
项目中主要用到的是FlexiGrid插件,该插件类似Ext的GridPanel。我把这个插件简单的修改了一下,只能更多的功能
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->//add cell
$('thead tr:first th', g.hDiv).each
(
function() {
var idx = $(this).attr('axis').substr(3);
if (n.name == row.cell[idx].name) {
td.align = this.align;
//render(cell,row,data,index) 刘冬
//cell:当前单元格的数据
//row:当前行数据
//data:所有数据
//index:当前行号
var col = n;
var cell = row.cell[idx].value;
if (col.render) {
td.innerHTML = col.render(cell, row, data, idx);
} else {
td.innerHTML = cell;
}
$(tr).append(td);
$(td).attr("value", cell); //插入实际值(value)的属性
}
});
先秀一下FlexiGrid 的效果(图3)
(图3)
还用到了jquery.UI和jquery.form插件(图4)
(图4)
NVelocity ,我是用于导出Excel。首先写一个XML格式的模板,然后用其替换上面的内容,最后输入Excel文件(图5)
(图5)
至于WCF,我放弃了Runtime.Serialization功能,而改用引用实体和契约(Contract)。
V1.0版本中 FlexiGrid功能列表:
1.数据的增删改
2.显示/隐藏列
3.页面中绑定列
4.计算列(A列与B列的计算),小计,合计
5.导出Excel
6.设置分页数量
扩增FlexiGrid API
1.在colModel的配置中增加render方法,其中有4个参数
cell:单元格焦点的数据, row:该行数据, data:所有数据, index:行号。
通过这些参数我们可以实现计算列、小计、合计、序号等功能。§
例如:render: function(cell, row, data, index) {
return cell ? "男" : "女" ;
}
2.在获取当前行中数据的函数$('.trSelected td:nth-child(1)', grid)中,参数value属性。通过value可以获取当前单元格的值,而不是显示出的内容。
如:显示"男" ,获取到true
存在的Bug
1.jquery.flexbox插件实现下拉框的动态选择
2.FlexiGrid服务器端筛选(过滤)
FlexiGrid中文API手册
属性名 |
说明 |
类型 |
默认值 |
height |
高度 |
数值 |
200 |
width |
宽度 |
数值|字符 |
auto |
striped |
隔行变色 |
布尔 |
true |
novstripe |
显示条纹 |
布尔 |
false |
minwidth |
列的最小宽度 |
数值 |
30 |
minheight |
列的最小高度 |
数值 |
80 |
resizable |
可拖动网格大小 |
布尔 |
true |
url |
Ajax请求地址 |
字符 |
false |
method |
请求方式(POST|GET) |
字符 |
POST |
dataType |
数据类型(JSON|XML,建议使用JSON) |
字符 |
'xml' |
errormsg |
错误提升信息 |
字符 |
Connection Error |
usepager |
使用分页 |
布尔 |
false |
page |
当前页码 |
数值 |
1 |
total |
总行数 |
数值 |
1 |
useRp |
显示分页下拉列表 |
布尔 |
true |
rp |
每页显示行数 |
数值 |
15 |
rpOptions |
分页设置 |
数组 |
[10, 15, 20, 25, 40], |
title |
显示标题 |
布尔 |
false |
pagestat |
显示当前页和总页面的样式,{from}、{ to }、{ total }分别为开始数、结束数、总数 |
字符 |
Displaying {from} to {to} of {total} items |
procmsg |
正在处理的提示信息 |
字符 |
Processing, please wait ...' |
query |
搜索查询的条件 |
字符 |
空字符 |
qtype |
搜索查询的列名 |
字符 |
空字符 |
nomsg |
无结果的提示信息 |
字符 |
No items |
hideOnSubmit |
隐藏提交 |
布尔 |
true |
autoload |
自动加载 |
布尔 |
true |
blockOpacity |
透明度设置 |
数值 |
0.5 |
onToggleCol |
当在行之间转换时 |
布尔 |
false |
FlexiGrid修改版下载
代码下载
SVN代码托管地址:http://springnetdemo1.googlecode.com/svn/trunk/
版权所有:博客园 刘冬.NET
感谢朋友对我的支持,和经常探讨问题的朋友们 孤独侠客 莫耶
参考:
http://www.cnblogs.com/lonely7345/archive/2009/02/03/1382780.html
http://www.cnblogs.com/moye/archive/2008/11/30/1344369.html
FlexiGrid插件的使用(ASP项目)相关推荐
- idea插件tomcat8-maven-plugin远程部署项目~
简介: 在项目中时常需要部署项目,在程序员的工作中大部分时间,不是再解决bug,就是在部署项目的路上,有得时候各种各样的环境,部署时间就占用了一大半. 解决方案: 1.开启tomcat的远程部署,修改 ...
- maven项目打包插件:将maven项目打包成一个可执行的jar(瘦jar)
通过maven-dependency-plugin插件和maven-jar-plugin来组合,maven-jar-plugin其实是maven项目自带的,在pom文件里面不依赖也是可以的,但是我需要 ...
- Docker入门(运行.net core asp项目)
1.安装docker 官网下载docker for windows,点击下一步 docker安装:https://blog.csdn.net/go_d_og/article/details/75675 ...
- Myeclipse10.7安装git插件并将Java项目上传到码云(github)
注:本文来源:外匹夫的<Myeclipse10.7安装git插件并将Java项目上传到码云(github)> 一.先说说安装egit插件的步骤(安装egit不成功的原因主要是下载的egit ...
- maven 插件如何加载项目中的类
maven 插件如何加载项目中的类 有不少插件希望扫描所在项目的类,如利用反射加载项目中的类,但如果不看官方文档直接开发,最初特别容易掉入一个深坑--ClassNotFoundException.因为 ...
- eclipse引入svn插件,并将项目同步到svn
1. eclipse中不存在SVN问题的解决 1.1发现Team->Share project 下没有svn. 1.2下载安装svn插件. 选择help->Eclipse Marketpl ...
- 知识图谱前端插件_大型前端项目可持续演进开发的思考
引言 当谈起这个话题的时候,不得不去想到<人月神话>这本著作中所描述的软件工程思想,其中的最后一段总结论述: 软件工程的焦油坑在将来很长一段时间内会继续地使人们举步维艰,无法自拔.软件系统 ...
- 通过插件自动将maven项目打成jar包的同时将当前项目依赖的第三方Jar包一起打包
1.添加插件 <build><plugins><!-- 如果已经在Maven的全局配置中,配置了JDK编译的界别,这个插件可以省略 --><!-- <p ...
- eclipse maven插件创建java web项目(2)
为什么80%的码农都做不了架构师?>>> 好了.马不停蹄,再来一篇使用骨架创建maven web项目的方法,大神就不要看了,小白快来学习吧 开始, 1>创建maven项目 ...
最新文章
- python学习第二课要点记录
- 搭建一个通用的脚手架
- 2017第35周日乱记
- Oracle .事物,提交,回滚
- MyBatis映射文件3(参数处理Map)
- 集成电路模拟版图入门-版图基础学习笔记(四)
- 第二届上汽零束SOA平台开发者大会揭幕,智能汽车生态加速落地
- KBL406-ASEMI整流桥KBL406
- java浏览 下单界面_Javaweb网上商城项目实战(24)实现订单详情查询功能
- 银联权益信息API接口及管理平台解决方案相关介绍
- UVM-- Sequencer和driver
- 微信支付【 wx.chooseWXPay、WeixinJSBridge.invoke】
- 快递查询单号查询,分享简单好用查询技巧
- 计算机科学与技术考研报名属于哪一类,计算机考研属于13大门类的哪一类
- spring boot 使用 bboss 操作 ES
- Unity间接光 ibl(基于图像的渲染)和SH(球谐光照)
- PNG warning: iCCP: known incorrect sRGB profile
- 移动IM开源框架对比
- MJ对2008年10月6日大盘预测(节后第一天)
- 最新:拼多多将追回所有“薅羊毛”订单,包括已充值话费和Q币订单...
热门文章
- Python语言-NL-数值运算
- NVIDIA和AMD各型号显卡超频参数一览表
- react 实现问卷调查(单选题目、多选题目)
- vue v-html 中@click 和 class 不生效问题解决方案
- power BI 中x轴日期值显示英文改为数值形式
- 常用电平标准(TTL、CMOS、LVTTL、LVCMOS、ECL、PECL、LVPECL、RS232)
- 基于.Net TcpListener 实现 WebSocketServer 通讯
- C# 使用WebSocket创建聊天室
- 二进制里的「逢二进一」是什么意思
- android6.0.1隐藏功能,安卓6.0系统界面调谐器怎么使用?安卓6.0隐藏功能开启和使用方法[多图]...