[发明专利]一种无刷新实现分页排序表格的方法及装置

说明书

技术领域

本发明涉及计算机技术领域，具体地说是一种无刷新实现分页排序表格的方法及装置。

背景技术

在大多数的Web开发中，表格控件一直是Web应用中使用频度较高且复杂度较大的一种控件。

受限于Web交互模式的特点（即需要不断地与后台服务器做数据交互），类似于Winform那种做一个操作之后，能接着返回相应结果这种方式，在Web上变得比较困难，因为如果通过传统方式，整个页面不得不整体刷新一下才能够看到返回的结果，这对使用来说，体验不怎么好，并且对应很大的开发量如分页、排序、后台数据绑定。

发明内容

本发明的技术任务是针对以上不足之处，提供一种无刷新实现分页排序表格的方法及装置，实现无刷新加载后台数据、自动分页、自动排序、自适应页面、表头固定、表格编辑等功能。

本发明解决其技术问题所采用的技术方案是：

一种无刷新实现分页排序表格的方法及装置，Web表格组件通过在visualstudio设计器中以控件的形式拖拽到web页面设计器中进行使用，在设计器中定义表格的属性：是否分页、是否自动排序、单页记录数、行交替颜色、数据源对象属性、表格高度等内容，在每一个列中指定改列的绑定字段、显示名称、宽度、样式、对齐方式等信息，就可以快速完成一个表格的定义和显示；

实施方法如下：

1）、web页面加载时，向页面中定向数据Grid相关的控制脚本以及公共方法，包括请求后台的ashx文件地址、参数、表格高度设定、分页和排序的方法生成等信息；

2）、点击排序或者分页按钮时，通过JavaScript封装定义好的处理函数，将请求通过ajax方式发送到服务器端；

3）、服务器端通过数据源接口反射调用，获取到对应的数据集；

4）、借助于微软DataGrid控件对数据集进行数据的绑定，同时在绑定过程中处理合计、行合并、绑定事件等操作；

5）、将绑定生成的结果输出转化成HTML标记，最后通过ajax将生成的HTML标记回传到客户端，最终通过JavaScript将结果显示到页面。

本发明的一种无刷新实现分页排序表格的方法及装置和现有技术相比，具有以下有益效果：

本发明通过封装设计好的一套表格组件，可以直接通过拖拽的形式在设计器中进行排版和定义，最终展现出来的是一个可以无刷新显示数据的Web表格。设计简单、功能强大是本表格的最大特点，即可以实现强大的功能同时也降低了开发的难度；

本发明基于web的表格组件，通过该表格可以实现无刷新加载后台数据、自动分页、自动排序、自适应页面、表头固定、表格编辑等功能，本表格可以可视化在visualstudio设计器中进行拖拽及各种属性的定义，并提供前台的JavaScript的API函数及后台C#端的标准接口，是基于web进行复杂应用设计的有力工具。开发人员不需要关注后台的数据交互，只需要把精力放在关键的业务点即可，通用的操作由此装置自动完成。

附图说明

下面结合附图对本发明进一步说明。

附图1为组件处理流程图；

附图2为分组结果表图。

具体实施方式

下面结合附图和具体实施例对本发明作进一步说明。

实施例一：

在设计器中定义表格的属性：是否分页、是否自动排序、单页记录数、行交替颜色、数据源对象属性、表格高度等内容，在每一个列中指定改列的绑定字段、显示名称、宽度、样式、对齐方式等信息，就可以快速完成一个表格的定义和显示。

配置项：web.config中配置好处理节点：

<httpHandlers>

<addverb=POST,GETpath=ajax/*.ashxtype=Ajax.PageHandlerFactory,Ajax/>

<addverb=*path=*.ashxtype=Seejee.CFDataGrid.NonRefresh,TableViewvalidate=false/>

</httpHandlers>

第一个节点为Ajax组件的处理节点，第二个节点为表格组件的处理节点。

两种数据源的支持：

1、后台数据源定义方式：

实现IGetDataSource接口，接口中完成数据源的返回，如下所示：

#regionIGetDataSource成员