.NET之 Extjs4.0 Grid分页显示

来源：互联网发布：如何成为淘宝主播编辑：程序博客网时间：2024/05/16 12:59

昨天完成了 J2EE的 EXTJS Grid分页，今天研究了下.NET下的 Extjs Grid分页，

最大的区别是分页语句不同，别的都大同小异：

上代码：

search.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Search.aspx.cs" Inherits="Search" %><!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 runat="server">    <title>Search</title>     <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" /><script type="text/javascript" src="extjs/bootstrap.js" ></script><script type="text/javascript" src="extjs/ext-all.js" ></script><script type="text/javascript"  >//预加载Ext.require([ 'Ext.grid.*', 'Ext.toolbar.Paging', 'Ext.data.*' ] );Ext.onReady(function(){//创建ModelExt.define('User',{extend:'Ext.data.Model',fields:[        {name:'id',mapping:'id'},        {name:'name',mapping:'name'},        {name:'date',mapping:'date'},        {name:'origin',mapping:'origin'}]})//创建数据源var store = Ext.create('Ext.data.Store',{model:'User',//设置分页大小pageSize:5,proxy: {        type: 'ajax',        url : 'PageJson.aspx',        reader: {//数据格式为json            type: 'json',            root: 'bugs',            //获取数据总数            totalProperty: 'totalCount'        }    },autoLoad:true});//创建gridvar grid = Ext.create('Ext.grid.Panel',{store:store,columns:[            {text:'ID',width:120,dataIndex:'id',sortable:true},         {text:'姓名',width:120,dataIndex:'name',sortable:true},         {text:'性别',width:120,dataIndex:'date',sortable:true},         {text:'年龄',width:120,dataIndex:'origin',sortable:true}],height:200,         width:480,         x:20,         y:40,         title: 'ExtJS4 Grid分页查询示例示例',         renderTo: 'grid',                //分页功能        bbar: Ext.create('Ext.PagingToolbar', {                     store: store,                     displayInfo: true,                     displayMsg: '显示 {0} - {1} 条，共计 {2} 条',                     emptyMsg: "没有数据"           }        ) })//store.loadPage(1);   store.load({ params: { start: 0, limit: 5} });})</script></head><body>    <form id="form1" runat="server">    <div id="grid">        </div>    </form></body></html>

后台代码：

search.aspx.cs:

using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;using System.Data.SqlClient;using System.Text;public partial class PageJson : System.Web.UI.Page{    int total = 0;    protected void Page_Load(object sender, EventArgs e)    {        int start =Convert.ToInt32( Request.Params["start"]);        int limit =Convert.ToInt32( Request.Params["limit"]);        jsData(start, limit);    }    public void jsData(int start, int limit)    {        SqlConnection conn = new SqlConnection("server=localhost;database=Extjs;uid=sa;pwd=1234");        //分页查询语句          string sql = " SELECT TOP " + limit + " * FROM search WHERE (ID NOT IN (SELECT TOP " + start + " id FROM search ORDER BY id))ORDER BY ID";        SqlCommand cm = new SqlCommand(sql, conn);        DataTable dt = new DataTable();        SqlDataAdapter da = new SqlDataAdapter();        da.SelectCommand = cm;        conn.Open();        cm.ExecuteNonQuery();        da.Fill(dt);        conn.Close();        Response.Write(CreateJsonParameters(dt).ToString());           }    //计算总数    public void totalcount()    {        SqlConnection conn = new SqlConnection("server=localhost;database=Extjs;uid=sa;pwd=1234");        string sql = "select count(*) as total from search";        SqlDataAdapter da = new SqlDataAdapter(sql, conn);        DataSet ds = new DataSet();        da.Fill(ds, "table");        total = Convert.ToInt32(ds.Tables[0].Rows[0]["total"].ToString());    }    public string CreateJsonParameters(DataTable dt)    {        totalcount();//计算总数        StringBuilder JsonString = new StringBuilder();        //Exception Handling                if (dt != null && dt.Rows.Count > 0)        {            JsonString.Append("{totalCount:" + total + ",bugs:[ ");            for (int i = 0; i < dt.Rows.Count; i++)            {                JsonString.Append("{ ");                for (int j = 0; j < dt.Columns.Count; j++)                {                    if (j < dt.Columns.Count - 1)                    {                        JsonString.Append(dt.Columns[j].ColumnName.ToString() + ":" + "\"" + dt.Rows[i][j].ToString() + "\",");                    }                    else if (j == dt.Columns.Count - 1)                    {                        JsonString.Append(dt.Columns[j].ColumnName.ToString() + ":" + "\"" + dt.Rows[i][j].ToString() + "\"");                    }                }                if (i == dt.Rows.Count - 1)                {                    JsonString.Append("} ");                }                else                {                    JsonString.Append("}, ");                }            }            JsonString.Append("]}");            return JsonString.ToString();        }        else        {            return null;        }    }}

截图：