关于基于jquery的jqGrid后台数据传送的问题

[峰北红]

有谁用过jqGrid吗？这个jquery的第三方插件。

后台一个ashx文件返回的应该是json格式的字符串，但是在真正的信息前面还要加上当前页、总页数、数据总行数等键/值。请问这些信息的作用，jqgrid的原理是是接受这些参数后才决定显示第几页吗？当点击翻页时是不是还需要往后台传参数并且编写翻页函数才能显示正确的页数据。
jqgrid有没有这样的功能，在初始化的时候后台直接传递数据后，jqgrid的初始化函数设置翻页信息，点击翻页按钮它自动获取数据？

写的可能有点乱，其实主要是后台传递数据的格式，还有表格翻页效果的实现这两个问题。

[linus2008117]

一种模式是数据全部取到客户端，jqgrid自动分页。
另一种根据jqgrid要显示的页数，从后台取指定页数据，返回值需要自己设置 当前页 总页数 行数信息。

[峰北红]

[Quote=引用 1 楼 linus2008117 的回复:]

一种模式是数据全部取到客户端，jqgrid自动分页。
另一种根据jqgrid要显示的页数，从后台取指定页数据，返回值需要自己设置 当前页 总页数 行数信息。
[/Quote]
谢谢，原来可以自动分页的啊。
如果自动分页的话前台jqgrid初始化函数还是普通的写法吧？那后台的数据该如何传送呢，或者说后台的格式是什么样的？还需要写那些当前页 总页数 行数信息吗，按说应该不用写了吧？

[linus2008117]

你用的是asp.net版的话，直接绑定就可以了。
JQGrid1.DataSource = GetData();
JQGrid1.DataBind();
用发跟普通服务器控件一样

[峰北红]

[Quote=引用 3 楼 linus2008117 的回复:]

你用的是asp.net版的话，直接绑定就可以了。
JQGrid1.DataSource = GetData();
JQGrid1.DataBind();
用发跟普通服务器控件一样
[/Quote]
呃，能否说的再详细点呢？
比如说，JQGrid1是哪里来的？GetData()是数据操作的函数吗？返回的是DataTable类型的数据？
DataBind()应该是绑定的意思吧？

[峰北红]

[Quote=引用 3 楼 linus2008117 的回复:]

你用的是asp.net版的话，直接绑定就可以了。
JQGrid1.DataSource = GetData();
JQGrid1.DataBind();
用发跟普通服务器控件一样
[/Quote]
如果非要在前台写jqgrid的代码呢？后台的数据格式应该是什么样的？
我看了http://www.trirand.net/demo.aspx上的demo,在.net中应该是引用了一个dll文件,然后在把jqgrid当成一个控件使用吧？

[linus2008117]

jdgrid 有一个asp.net 的封装，使用类似服务器控件gridview 和 datagrid。

GetData 是去数据的方法，返回的是DataTable

[linus2008117]

[Quote=引用 5 楼 xinzhu1990 的回复:]

引用 3 楼 linus2008117 的回复:

你用的是asp.net版的话，直接绑定就可以了。
JQGrid1.DataSource = GetData();
JQGrid1.DataBind();
用发跟普通服务器控件一样

如果非要在前台写jqgrid的代码呢？后台的数据格式应该是什么样的？
我看了http://www.trirand.net/demo.aspx上的de……
[/Quote]

那个的使用就像控件一样，不过要收费的。看你们是否考虑授权问题

[linus2008117]

原生态的返回数据格式
{'page':1,'total':10,'records':100,'data':[{'userName':'系统管理','userCode':'admin'},{'userName':'测试','userCode':'test'}]}

jsonReader:
{
page: "page",
total: "total",
records: "records",
root: "data",
repeatitems: false,
id: "UserCode"
},

[峰北红]

多谢哈，很详细，是得考虑一下收费的问题。
不过问题还在，按照这种格式传递给前台，就是接受不到数据。
按照另外一个例子，前台可以接受到，但却是固定页的例子，无法自动翻页。
痛苦中

[linus2008117]

我给的有误
id: "UserCode" 注意大小写

[linus2008117]

最好把前后台代码发出来

[峰北红]

$("#list").jqGrid({
url: 'json.ashx',
datatype: "json",
mtype: 'POST',
colNames: ['id', 'title', 'content', 'content', 'content', 'content', 'content'],
colModel: [
{ name: 'id', index: 'id', width: 55, sortable: false, editable: false },
{ name: 'invdate', index: 'invdate', width: 100, editable: true },
{ name: 'name', index: 'name', width: 100, editable: true },
{ name: 'name', index: 'name', width: 100, editable: true },
{ name: 'name', index: 'name', width: 100, editable: true },
{ name: 'name', index: 'name', width: 100, editable: true },
{ name: 'name', index: 'name', width: 100, editable: true }
],

//json数据结构
rowNum: 10,
rowList: [10, 20, 30, 40],
pager: $('#pager'),
sortname: 'id',
viewrecords: true,
sortorder: "asc",
caption: "数据表格"
}).navGrid('pager',
{ view: true, edit: true, add: false, del: false },
{ closeOnEscape: true }
);
这是前台aspx页面的jqgrid的代码

[峰北红]

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
using System.Text;
using OnlineJudge.BLL;
using OnlineJudge.DAL;
using OnlineJudge.MODEL;
using System.Web.Script.Serialization;

namespace OnlineJudge.FRAME.Teacher
{
/// <summary>
/// json 的摘要说明
/// </summary>
public class json : IHttpHandler
{

public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Buffer = true;
context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-1);
context.Response.AddHeader("pragma", "no-cache");
context.Response.AddHeader("cache-control", "");
context.Response.CacheControl = "no-cache";
int page = Convert.ToInt32(context.Request.QueryString["page"]);//设定要显示第几页的内容
int rows = Convert.ToInt32(context.Request.QueryString["rows"]);//设置要显示的行数
if (page == 0 || rows == 0) {
page = 1;
rows = 10;
}
context.Response.Write(jsonstring(page, rows, 30));
}
//records数据总行数，从数据库获得
private string jsonstring(int page, int rows, double records)
{
double a = records / rows;
int total = Convert.ToInt32(Math.Ceiling(a));//总页数
StringBuilder sb = new StringBuilder("{");
sb.AppendFormat(@"""page"":""{0}"",""total"":{1},""records"":""{2}"",""rows"":{3}", page, total, records, createrows(rows * (page - 1), rows * page));
sb.Append("}");
return sb.ToString();
}
private string createrows(int pageS, int pageE)
{
StringBuilder s = new StringBuilder("[");
for (; pageS < pageE; pageS++)
{
s.Append("{");
s.AppendFormat(@"""id"":""{0}"",""cell"":[""{1}"",""{2}"",""{3}"",""{4}"",""{5}"",""{6}"",""{7}""]", pageS + 1, pageS + 1, DateTime.Now.ToString(), "ClientXXX", "10000.0", "0.000", "1000", null);
if (pageS != pageE - 1)
s.Append("},");
}
s.Append("}]");
return s.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
这是数据处理文件json.ashx的代码

[峰北红]

辛苦了哈，其实这个例子也是找的网上的，但是发现点翻页按钮没反应。
还有一个例子直接就是显示不出来数据。
两个例子都返回的json数据，格式都要加前几个参数的，我就想如果实现自动翻页那第一回还有必要传递这些参数嘛，直接传递全部数据了都。

[linus2008117]

嘿嘿，今天有空用aspx试了下，如有问题，检查js是否引用全，注意列名大小写

protected void Page_Load( object sender, EventArgs e )
{
Response.Clear( );

Response.Write( "{\"total\":1,\"page\":1,\"records\":2,\"rows\":[{\"id\":1,\"title\":\"title1\"},{\"id\":2,\"title\":\"title2\"}]}" );

Response.End( );
}

js

$(document).ready(function ()
{
$("#list").jqGrid({
url: 'webform5.aspx',
datatype: "json",
mtype: 'post',
colNames: ['id', 'title'],
colModel: [ { name: 'id', index: 'id' }, { name: 'title', index: 'title' } ],

//json数据结构
rowNum: 2,
pager: $('#pager'),
viewrecords: true,
caption: "数据表格",
loadonce:true,
jsonReader:
{
page: "page",
total: "total",
records: "records",
root: "rows",
repeatitems: false,
id: "id"
}
});
});