赞助商
下面是我项目中用到的技术(图1):
1.JQueryFlexiGrid插件
2.ASP.NET MVC3.NVelocity 目前没有与MVC结合,只是用来简单的替换模板
4.WCF
5.LINQ
6.NHibernate

附件: 2009-11-10.2.gif
(图1)

目前版本是V1.0版本,我以后会定期更新这个项目。该项目包含了18个类库(图2)。我后续会更新这篇文章和代码,试图打造一套完美的解决方案。

附件: 2009-11-10.8.gif
(图2)

项目中主要用到的是FlexiGrid插件,该插件类似Ext的GridPanel。我把这个插件简单的修改了一下,只能更多的功能
flexigrid
  1. //add cell
  2.                             $('thead tr:first th', g.hDiv).each
  3.                                 (
  4.                                     function() {

  5.                                         var idx = $(this).attr('axis').substr(3);

  6.                                         if (n.name == row.cell[idx].name) {

  7.                                             td.align = this.align;

  8.                                             //render(cell,row,data,index) 刘冬
  9.                                             //cell:当前单元格的数据
  10.                                             //row:当前行数据
  11.                                             //data:所有数据
  12.                                             //index:当前行号
  13.                                             var col = n;
  14.                                             var cell = row.cell[idx].value;
  15.                                             if (col.render) {
  16.                                                 td.innerHTML = col.render(cell, row, data, idx);
  17.                                             } else {
  18.                                                 td.innerHTML = cell;
  19.                                             }
  20.                                             $(tr).append(td);

  21.                                             $(td).attr("value", cell);  //插入实际值(value)的属性
  22.                                         }

  23.                                     });
复制代码
先秀一下FlexiGrid 的效果(图3)

附件: 2009-11-10.4.gif
(图3)

  还用到了jquery.UI和jquery.form插件(图4)

附件: 2009-11-10.6.gif
(图4)

  NVelocity 我是用于导出Excel。首先写一个XML格式的模板,然后用其替换上面的内容,最后输入Excel文件(图5)

附件: 2009-11-10.7.gif
(图5)

  至于WCF,我放弃了Runtime.Serialization功能,而改用引用实体和契约(Contract)。(文/刘冬.NET

  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服务器端筛选(过滤)

参考链接:
Spring.Net+NHibenate+Asp.Net mvc +ExtJs 系列 6----asp.net MVC+Extjs
.net企业级架构实战之7——Spring.net整合Asp.net mvc                               

代码下载:
赞助商
赞助商
TOP