Asp.net使用jQuery实现数据绑定与分页
使用jQuery来实现Gridview, Repeater等服务器端数据展示控件的数据绑定和分页。本文的关注重点是数据如何实现数据绑定。
Content
jQuery的强大和可用性使得其迅速的流行起来。微软也发布了一个补丁使得VS支持对jQuery的智能感应。由于Gridview,Repeater等控件的复杂性,使得几乎无法通过javascript在客户端对其进行赋值。但是我们又不想放弃这些控件提供的强大功能和便利性,尤其是我们已经习惯了使用这些控件来展示大量的数据。因此如果能把jQuery和Gridview结合起来使用,那应该是很爽的一件事情。
我最近比较喜欢用Repeater这个控件,所以,这里就用一个Repeater显示查询的结果。
首先在页面上定义好这个控件显示的各个字段:
<asp:PlaceHolder ID="specialRedeemPlaceHolder" runat="server" Visible="false">
<table id="specialRedeemInfo">
<caption>查询结果</caption>
<thead>
<tr>
<th>奖品名称</th>
<th>姓名</th>
<th>美容顾问编号</th>
<th>数量</th>
<th>所需积分</th>
<th>日期</th>
<th>状态</th>
<th></th>
</tr>
</thead>
<tbody>
<asp:Repeater id="rptSpecialRedeemInfo" runat="server" EnableViewState="false"
onitemdatabound="rptSpecialRedeemInfo_ItemDataBound">
<ItemTemplate>
<tr class="item">
<td><%# Eval("PartName") %></td>
<td><%# Eval("ConsultantName") %></td>
<td><%# Eval("ConsultantID")%></td>
<td><%# Eval("Quantity")%></td>
<td><%# Eval("PointCost")%></td>
<td><%# Eval("InsertedTime")%></td>
<td><%# Eval("DisplayStatus")%></td>
<td><input id="btnProcess" type="button" runat="server" /></td>
</tr>
</ItemTemplate>
</asp:Repeater>
</tbody>
</table>
</asp:PlaceHolder>
因为实现的是AJAX的查询,因此可以设置repeater的 EnableViewState=”false”。 这个placeholder定义的是数据显示的格式,而不是显示在网页上的位置。因此需要定义一个显示查询结果的位置,这里定义一个div
<div id="queryResult">
</div>
OK, 当客户端处理查询事件时,可以利用jQuery的load方法:
$("#queryResult").load("SpecialRedeemManagement.aspx #specialRedeemInfo",
{ Func: "Search", ConsultantID: consultantId}, //各个参数
ajaxComplete); //当查询完成时调用这个JS
服务器端可以通过Request.Params["Func"]获取各个参数。在 处理这个查询事件时,首先
specialRedeemPlaceHolder.Visible = true; //设置placeholder的visible=true
然后再给repeater绑定数据(太简单就不贴代码了)。(onitemdatabound此事件仍然有效)
再把这个palcecontrol写到Response流中去:
StringWriter tw = new StringWriter();// *** Simple rendering - just write the control to the text writer
// *** works well for single controls without containers
Html32TextWriter writer = new Html32TextWriter(tw);
this.specialRedeemPlaceHolder.RenderControl(writer);
writer.Close(); Response.Write(tw.ToString());
Response.End();
解释一下这句:$("#queryResult").load("SpecialRedeemManagement.aspx #specialRedeemInfo",
加上"#specialRedeemInfo”会使jQuery只获取返回的Response中id为specialRedeemInfo的控件那部分。好处就是在一个查询中,如果需要的话,可以返回多个供显示的控件流。
除此之外,还有一点需要做的就是重写一个方法:
public override void VerifyRenderingInServerForm(Control control)
{
//base.VerifyRenderingInServerForm(control);
}
至于这个方法是做什么的,呵呵,有兴趣的自己去查一下吧
Asp.net使用jQuery实现数据绑定与分页的更多相关文章
- Spring Data Jpa+SpringMVC+Jquery.pagination.js实现分页
本博客介绍基于Spring Data这款orm框架加上Jquery.pagination插件实现的分页功能. 介绍一下Spring Data框架 spring Data : Spring 的一个子项目 ...
- 如何构建ASP.NET MVC4&JQuery&AJax&JSon示例
背景: 博客中将构建一个小示例,用于演示在ASP.NET MVC4项目中,如何使用JQuery Ajax. 步骤: 1,添加控制器(HomeController)和动作方法(Index),并为Inde ...
- 第二百零九节,jQuery EasyUI,Pagination(分页)组件
jQuery EasyUI,Pagination(分页)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Pagination(分页)组件的使 ...
- jquery自定义插件实现分页效果
这节介绍如何自定义jquery插件,实现分页效果,话不多说,先看看实现的效果: 分页插件 实现的代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTM ...
- C#字符串数组排序 C#排序算法大全 C#字符串比较方法 一个.NET通用JSON解析/构建类的实现(c#) C#处理Json文件 asp.net使用Jquery+iframe传值问题
C#字符串数组排序 //排序只带字符的数组,不带数字的 private string[] aa ={ "a ", "c ", "b & ...
- asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发4- 后台模板html页面创建
上一篇教程<asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发3-登录模块开发>完成了本项目的登录模块,登录后就需要进入后台管理首页了,需要准备一个后台模 ...
- asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发2-Model层建立
上篇(asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发1-准备工作)文章讲解了开发过程中的准备工作,主要创建了项目数据库及项目,本文主要讲解项目M层的实现,M层这里 ...
- asp.net mvc+jquery easyui开发实战教程之网站后台管理系统开发1-准备工作
/****** Object: 新闻表 Script Date: 2017/9/2 星期六 15:11:12 ******/ SET ANSI_NULLS ON GO SET QUOTED_IDENT ...
- ASP.NET MVC+EF在服务端分页使用jqGrid以及jquery Datatables的注意事项
引言: 本人想自己个博客网站出来,技术路线是用ASN.NET MVC5+EF6(Code First)+ZUI+各种Jquery插件,有了这个想法之后就开始选择UI,看了好多bootstrap的模板之 ...
随机推荐
- C#中实现对Excel特定文本的搜索
打开Excel的VBA帮助,查看Excel的对象模型,很容易找到完成这个功能需要的几个集合和对象: Application.Workbooks. Workbook.Worksheets还有Worksh ...
- ylb:多表的连接与练习(第三方关联表的应用)
ylbtech-SQL Server:SQL Server-多表的连接与练习(第三方关联表的应用) SQL Server 多表的连接与练习(第三方关联表的应用). 1,多表的连接与练习(第三方关联表的 ...
- 数组名的含义.xml
pre{ line-height:1; color:#1e1e1e; background-color:#f0f0f0; font-size:16px;}.sysFunc{color:#627cf6; ...
- ISO-8859-1
ISO-8859-1编码是单字节编码,向下兼容ASCII,其编码范围是0x00-0xFF,0x00-0x7F之间完全和ASCII一致,0x80-0x9F之间是控制字符,0xA0-0xFF之间是文字符号 ...
- c语言的几个重要知识点
内存结构 这是核心中的核心,请仔细看完,充分理解,否则请不要看下一节内容. 每个程序一启动都有一个大小为4GB的内存,这个内存叫虚拟内存,是概念上的,真正能用到的,只是很小一部分,一般也就是在几百 ...
- 使用JavaMail API发送邮件
发送邮件是很常用的功能,注册验证,找回密码,到货通知,欠费提醒等,都可以通过邮件来提醒. Java中发送邮件需要使用javax.mail.jar包,读者可以上网搜索或去官方下载,下载地址为: 下面贴上 ...
- 《学习OpenCV》练习题第四章第一题b&c
#include <highgui.h> #include <cv.h> #pragma comment (lib,"opencv_calib3d231d.lib&q ...
- phonegap 新窗口 WebView
自定义WebView窗口打开 import com.ap.work.QuickWeb public class QuickPlugin extends CordovaPlugin { /** * 新开 ...
- 第三百三十九天 how can I 坚持
脑子里老是无缘无故浮现出之前学的古文,之前只是傻学了,什么都没搞懂啊. 吾师道也,夫庸知其年之先后生于吾乎?是故无贵无贱,无长无少,道之所存,师之所存也. 是故弟子不必不如师,师不必贤于弟子,闻道有先 ...
- Servlet 2.4 规范之第一篇:概览
写在前面的话: 本系列是对<Java Servlet Specification Version 2.4>的完全翻译,力争但不保证完美表达出英文原文的思想内涵.如有疏漏之处,还 ...