ajaxpro综合示例-ajaxpro无刷新更新gridview数据

来源:https://wwwdev.cn/article/20101223/ajaxpro-no-refresh-update-gridview.aspx

ajaxpro无刷新更新gridview数据
  ajaxpro使用的是prototype框架,所以和微软的ajax框架有一定的区别,不能在服务端直接绑定GridView控件,而是需要返回DatatTable或者DataSet对象,然后根据在客户端生成对应的DataTable或者DataSet的Json对象,重新绘制GridView在浏览器生成的table对象。

  源代码如下
ajaxpro-no-refresh-update-gridview.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ajaxpro-no-refresh-update-gridview.aspx.cs" Inherits="ajaxpro_no_refresh_update_gridview" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <title>ajaxpro无刷新更新gridview数据</title> </head> <body> <mce:script type="text/javascript"><!-- function reload() { ajaxpro_no_refresh_update_gridview.GridViewSource(callback); } function callback(r) { var rows = r.value.Rows, tb = document.getElementById('gv1'),tr,td; while (tb.rows.length > 1) tb.deleteRow(1); //删除除了页头的行 for (var i = 0; i < rows.length; i++) { tr = tb.insertRow(tb.rows.length); td = tr.insertCell(0); td.innerHTML = rows[i].Id; td = tr.insertCell(1); td.innerHTML = rows[i].rndNum; } } // --></mce:script> <table id="tb1"></table> <form id="form1" runat="server"><input type="button" value="马上更新" οnclick="reload()"/> <asp:GridView runat="server" ID="gv1"></asp:GridView> </form><!--一定不能缺少runat为server的表单,要不然ajaxpro不会自动生成对应的脚本和导入相关的框架代码--> </body> </html>
ajaxpro-no-refresh-update-gridview.aspx.cs

using System; using System.Data; public partial class ajaxpro_no_refresh_update_gridview : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { AjaxPro.Utility.RegisterTypeForAjax(typeof(ajaxpro_no_refresh_update_gridview)); gv1.DataSource = CreateDataSouce(); gv1.DataBind(); } private DataTable CreateDataSouce() {//创建数据源 DataTable dt = new DataTable(); dt.Columns.Add("Id"); dt.Columns.Add("rndNum"); Random r = new Random(); for (int i = 0; i < 20; i++) dt.Rows.Add(i, r.Next(1, 1000)); return dt; } [AjaxPro.AjaxMethod] public DataTable GridViewSource() { return CreateDataSouce(); } }
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Go 旅城通票

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值