jqGrid是一个优秀的基于jQuery的DataGrid框架，想必大伙儿也不陌生，网上基于ASP的资料很少，我提供一个，数据格式是json的：
、一个针对jqGrid的json类：这段代码似乎是由官网论坛的一些PHP中转化而来，我们存为json.asp，代码贴一下：
代码如下:
<%
response.Charset="utf-8"
''---------------------------------------
'' JSONClass类
'' 将Select语句的执行结果转换成JSON
''------------------------------------------
Class JSONClass
'' 定义类属性，默认为Private
Dim SqlString '' 用于设置Select
Dim JSON '' 返回的JSON对象的名称
Dim DBConnection '' 连接到数据库的Connection对象
'' 可以外部调用的公共方法
Public Function GetJSON ()
dim Rs
dim returnStr
dim i
dim& rs.pagecount &", page: "& page &", records: "& rs.recordcount &", rows:["
for j=0 to rs.pagesize-1
if rs.bof or rs.eof then exit for
'' -------
''oneRecord = "{id:" & chr(34) &Rs.Fields(0).Value&chr(34)&",cell:["& chr(34) &Rs.Fields(0).Value&chr(34)&","
oneRecord = "{id:" & chr(34) &Rs.Fields(0).Value&chr(34)&",cell:["& chr(34) &Rs.Fields(0).Value&chr(34)&","
for i=1 to Rs.Fields.Count -1
''oneRecord=oneRecord & chr(34) &Rs.Fields(i).Name&chr(34)&":"
oneRecord=oneRecord & chr(34) &Rs.Fields(i).Value&chr(34) &","
Next
''去除记录最后一个字段后的","
oneRecord=left(oneRecord,InStrRev(oneRecord,",")-1)
oneRecord=oneRecord & "]},"
''------------
returnStr=returnStr & -->
<!--#include file="json.asp" -->
<%
dim page,rows,sidx,sord
page = request.QueryString("page") ''page
rows = request.QueryString("rows") ''pagesize
sidx = request.QueryString("sidx") ''order by ??
sord = request.QueryString("sord")
if page="" then page = 1 end if
if rows = "" then rows = 10 end if
if sidx = "" then sidx = "id" end if
if sord = "" then sord ="asc" end if
Dim strSearchOn, strField, strFieldData, strSearchOper, strWhere
strSearchOn = Request("_search")
If (strSearchOn = "true") Then
strField = Request("searchField")
If (strField = "id" Or strField = "Title" Or strField = "NickName") Then
strFieldData = http://www.popasp.com/Request("searchString")
strSearchOper = Request("searchOper")
''construct where
strWhere = " Where " & strField
Select Case strSearchOper
Case "bw" : ''Begin With
strFieldData = http://www.popasp.com/strFieldData &"%"
strWhere = strWhere & " LIKE ''" & strFieldData & "''"
Case "eq" : ''Equal
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " = " & strFieldData
Else
strWhere = strWhere & " = ''" & strFieldData & "''"
End If
Case "ne": ''Not Equal
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " <> " & strFieldData
Else
strWhere = strWhere & " <> ''"& strFieldData &"''"
End If
Case "lt": ''Less Than
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " <" & strFieldData
Else
strWhere = strWhere & " <''"& strFieldData &"''"
End If
Case "le": ''Less Or Equal
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " <= " & strFieldData
Else
strWhere = strWhere & " <= ''"& strFieldData &"''"
End If
Case "gt": ''Greater Than
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " > " & strFieldData
Else
strWhere = strWhere & " > ''"& strFieldData &"''"
End If
Case "ge": ''Greater Or Equal
If(IsNumeric(strFieldData)) Then
strWhere = strWhere & " >= " & strFieldData
Else
strWhere = strWhere & " >= ''"& strFieldData &"''"
End If
Case "ew" : ''End With
strWhere = strWhere & " LIKE ''%" & strFieldData & "''"
Case "cn" : ''Contains
strWhere = strWhere & " LIKE ''%" & strFieldData & "%''"
End Select
End if
End If
server.ScriptTimeout=9000
dim a
set a=new JSONClass
a.Sqlstring="Select id,Title,NickName,Pwd,LastLoginTime From Admin"&strWhere&" "&"order by "& sidx & " " & sord
a.dbconnection=conn
response.Write(a.GetJSon())
conn.close()
set conn = nothing
%>
里面把搜索的代码涵盖了。这样基本实现了读，至于jqGrid中的editurl的文件，我们称其edit.asp，代码如下：
代码如下:
<%Option Explicit%>
<!--#include file="config.asp"-->
<%
Dim strOper, strID, strNickName, strTitle, strPwd
strOper = Request("oper")
strID = Replace(Request("Id"),"''","''''")
strTitle = Replace(Request("Title"),"''","''''")
strNickName = Replace(Request("NickName"),"''","''''")
strPwd = Replace(Request("Pwd"),"''","''''")
Select Case strOper
Case "add": ''Add Record
strSQL = "Insert Into Admin (Title, NickName, Pwd,LastLoginTime) Values(''"&strTitle&"'', ''"&strNickName&"'', ''"&strPwd&"'',Now()) "
Case "edit": ''Edit Record
strSQL = "Update Admin Set Title = ''"&strTitle&"'', NickName = ''"&strNickName&"'', Pwd = ''"&strPwd&"'' Where id = "&strID
Case "del": ''Delete Record
strSQL = "Delete From Admin Where id = "&strID
End Select
''response.Write strSQL
Dim strSQL,rs
Call OpenDB()
Set rs = Conn.Execute(strSQL)
Call CloseDB()
%>
这是前台index.html代码
代码如下:
<!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>ASP_jqGrid_Test</title>
<link rel="stylesheet" type="text/css" href="http://www.popasp.com/jquery-ui-1.7.2.custom.css"/>
<link rel="stylesheet" type="text/css" href="http://www.popasp.com/jqgrid.css"/>
<link rel="stylesheet" type="text/css" href="http://www.popasp.com/ui.multiselect.css"/>
<script type="text/javascript" src="http://www.popasp.com/js/jquery.js"></script>
<script type="text/javascript" src="http://www.popasp.com/js/cn.js"></script>
<script type="text/javascript" src="http://www.popasp.com/js/jqGrid.js"></script>
</head>
<body>
<table id="DataGrid" class="scroll"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
</body>
</html>
<script type="text/javascript">
jQuery("#DataGrid").jqGrid({
url:''list.asp'',
datatype: "json",
colNames:[''ID'',''管理员账号'',''管理员昵称'',''密码'',''上次登录时间''],
colModel :[
{
name:''Id'',
index:''Id'',
width:50
},
{
name:''Title'',
index:''Title'',
editable:true,
editrules:{
required:true
}
},
{
name:''NickName'',
index:''NickName'',
editable:true,
editrules:{
required:true
}
},
{
name:''Pwd'',
index:''Pwd'',
editable:true,
edittype:''password'',
hidden:true,
editoptions:{
size:20
},
editrules:{
edithidden:true
}
},
{
name:''LastLoginTime'',
index:''LastLoginTime'',
align:''right'',
editrules:{
required:true
}
} ], caption:"管理员列表",
imgpath:''/images'',
multiselect: true,
rowNum:20,
rowList:[10,20,30],
pager: jQuery(''#pager''),
sortname: ''Id'',
viewrecords: true,
sortorder: "desc",
height:400,
width:600,
editurl:"edit.asp"
});
$(''#DataGrid'').navGrid(''#pager'',{
refresh: true,
edit: true,
add: true,
del: true,
search: true,
searchtext:"搜",
edittext:"改",addtext:"添",deltext:"删"
});
</script>
jqGrid，好东西~~
