เนื่องจากฉันมี CMS ที่ค่อนข้างเป็นผู้ใหญ่ ฉันจึงไม่เคยยอมแพ้กับ ASP ฉันจึงอยากเขียนมันใหม่โดยใช้ .net มาโดยตลอด แต่นั่นเป็นเรื่องราวอีกครั้ง jqGrid เป็นเฟรมเวิร์ก DataGrid ที่ยอดเยี่ยมซึ่งใช้ jQuery ซึ่งทุกคนต้องคุ้นเคย มีข้อมูลน้อยมากตาม ASP บนอินเทอร์เน็ต ฉันจะจัดเตรียมข้อมูลไว้ดังนี้
, คลาส json สำหรับ jqGrid: ดูเหมือนว่าโค้ดนี้จะถูกแปลงจาก PHP บางตัวในฟอรัมเว็บไซต์อย่างเป็นทางการ เราบันทึกเป็น json.asp และวางโค้ด:
คัดลอกรหัสรหัสดังต่อไปนี้:
-
response.Charset=utf-8
-
'คลาส JSONClass
' แปลงผลลัพธ์การดำเนินการของคำสั่ง Select เป็น JSON
-
คลาส JSONClass
'กำหนดคุณสมบัติของคลาส ค่าเริ่มต้นคือส่วนตัว'
Dim SqlString ' ใช้เพื่อตั้งค่า Select
Dim JSON 'ชื่อของวัตถุ JSON ที่ส่งคืน
Dim DBConnection 'วัตถุการเชื่อมต่อกับฐานข้อมูล
'วิธีการสาธารณะที่สามารถเรียกได้จากภายนอก'
ฟังก์ชั่นสาธารณะ GetJSON()
สลัว Rs
ผลตอบแทนสลัวStr
สลัวฉัน
สลัวหนึ่งบันทึก
' รับข้อมูล
ตั้งค่า Rs= Server.CreateObject (ADODB.Recordset)
Rs.open SqlString,DBConnection,1,1
ถ้าหน้า <> แล้ว
epage=cint(หน้า)
ถ้า epage<1 ดังนั้น epage=1
ถ้า epage>rs.pagecount ดังนั้น epage=rs.pagecount
อื่น
หน้า=1
สิ้นสุดถ้า
rs.pagesize = แถว
rs.absolutepage = หน้าเพจ
' สร้างสตริง JSON
ถ้า Rs.eof=false และ Rs.Bof=false แล้ว
returnStr={ รวม: & rs.pagecount &, หน้า: & หน้า &, บันทึก: & rs.recordcount &, แถว:[
สำหรับ j=0 ถึง rs.pagesize-1
ถ้า rs.bof หรือ rs.eof ให้ออกเพื่อ
-
'oneRecord = {id: & chr(34) &Rs.Fields(0).Value&chr(34)&,เซลล์:[& chr(34) &Rs.Fields(0).Value&chr(34)&,
oneRecord = {id: & chr(34) &Rs.Fields(0).Value&chr(34)&,เซลล์:[& chr(34) &Rs.Fields(0).Value&chr(34)&,
สำหรับ i=1 ถึง Rs.Fields.Count -1
'oneRecord=oneRecord & chr(34) &Rs.Fields(i).ชื่อ&chr(34)&:
oneRecord=oneRecord & chr(34) &Rs.Fields(i).Value&chr(34) &,
ต่อไป
'หลังจากลบฟิลด์สุดท้ายของบันทึกแล้ว
oneRecord=ซ้าย(oneRecord,InStrRev(oneRecord,,)-1)
oneRecord=oneRecord & ]},
-
returnStr=returnStr & oneRecord
฿MoveNext
ต่อไป
' หลังจากลบอาร์เรย์บันทึกทั้งหมดแล้ว
returnStr=ซ้าย(returnStr,InStrRev(returnStr,,)-1)
returnStr=ส่งคืนStr & ]}
สิ้นสุดถ้า
฿ปิด
ตั้ง Rs=ไม่มีอะไร
GetJSON=returnStr
ฟังก์ชันสิ้นสุด
'วิธีการส่วนตัวที่ใช้ในชั้นเรียน'
ตรวจสอบฟังก์ชันส่วนตัว()
ฟังก์ชันสิ้นสุด
-
จบคลาส
-
2. สร้างไฟล์ asp ที่แสดงข้อมูล เช่น list.asp โดยมีโค้ดดังนี้
คัดลอกรหัสรหัสดังต่อไปนี้:
<!--#include file=conn.asp -->
<!--#include file=json.asp -->
-
หน้าสลัว แถว sidx เรียงลำดับ
page = request.QueryString(หน้า) 'page
rows = request.QueryString(rows) 'ขนาดหน้า'
sidx = request.QueryString(sidx) 'สั่งซื้อโดย ??
sort = คำขอ QueryString (sord)
ถ้า page= แล้ว page = 1 สิ้นสุด if
ถ้าแถว = ดังนั้น แถว = 10 สิ้นสุดถ้า
ถ้า sidx = ดังนั้น sidx = id สิ้นสุดถ้า
ถ้าsord = ดังนั้นsord =asc สิ้นสุดถ้า
หรี่ strSearchOn, strField, strFieldData, strSearchOper, strWhere
strSearchOn = คำขอ (_search)
ถ้า (strSearchOn = true) แล้ว
strField = คำขอ (searchField)
ถ้า (strField = id หรือ strField = Title หรือ strField = NickName) จากนั้น
strFieldData = คำขอ (searchString)
strSearchOper = คำขอ (searchOper)
'สร้างที่ไหน.
strWhere = ที่ไหน & strField
เลือกกรณี strSearchOper
กรณี bw : 'เริ่มต้นด้วย'
strFieldData = strFieldData & %
strWhere = strWhere & LIKE ' & strFieldData & '
กรณี eq : 'เท่ากับ
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & = & strFieldData
อื่น
strWhere = strWhere & = ' & strFieldData & '
สิ้นสุดถ้า
กรณีที่ ne: 'ไม่เท่ากัน'
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & <> & strFieldData
อื่น
strWhere = strWhere & <> '& strFieldData &'
สิ้นสุดถ้า
กรณี lt: 'น้อยกว่า'
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & < & strFieldData
อื่น
strWhere = strWhere & <'& strFieldData &'
สิ้นสุดถ้า
กรณี le: 'น้อยกว่าหรือเท่ากับ'
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & <= & strFieldData
อื่น
strWhere = strWhere & <= '& strFieldData &'
สิ้นสุดถ้า
กรณี gt: 'มากกว่า'
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & > & strFieldData
อื่น
strWhere = strWhere & > '& strFieldData &'
สิ้นสุดถ้า
กรณี ge: 'มากกว่าหรือเท่ากับ'
ถ้า(IsNumeric(strFieldData)) จากนั้น
strWhere = strWhere & >= & strFieldData
อื่น
strWhere = strWhere & >= '& strFieldData &'
สิ้นสุดถ้า
กรณี ew : 'จบด้วย'
strWhere = strWhere & LIKE '% & strFieldData & '
กรณี cn : 'มี'
strWhere = strWhere & LIKE '% & strFieldData & %'
สิ้นสุดการเลือก
จบถ้า
สิ้นสุดถ้า
เซิร์ฟเวอร์ ScriptTimeout=9000
สลัว
ตั้งค่า a=jSONClass ใหม่
a.Sqlstring=เลือก id,ชื่อเรื่อง,NickName,Pwd,LastLoginTime จากผู้ดูแลระบบ&strWhere& &เรียงลำดับโดย & sidx & & sord
a.dbconnection=เชื่อมต่อ
การตอบสนองเขียน (a.GetJSon())
con.ปิด()
ตั้งค่า conn = ไม่มีอะไร
-
รหัสการค้นหาครอบคลุมอยู่ในนั้น โดยพื้นฐานแล้วจะใช้การอ่าน สำหรับไฟล์ editurl ใน jqGrid เราเรียกมันว่า edit.asp
คัดลอกรหัสรหัสดังต่อไปนี้:
<%ตัวเลือกที่ชัดเจน%>
<!--#include file=config.asp-->
-
หรี่ strOper, strID, strNickName, strTitle, strPwd
strOper = คำขอ (ตัวดำเนินการ)
strID = แทนที่ (คำขอ (รหัส),', '')
strTitle = แทนที่ (คำขอ (ชื่อเรื่อง),','')
strNickName = แทนที่ (คำขอ (ชื่อเล่น),','')
strPwd = แทนที่ (คำขอ (Pwd),', '')
เลือก กรณี strOper
กรณีเพิ่ม: 'เพิ่มบันทึก'
strSQL = แทรกเข้าไปในผู้ดูแลระบบ (ชื่อ, ชื่อเล่น, Pwd, LastLoginTime) ค่า('&strTitle&', '&strNickName&', '&strPwd&',Now())
แก้ไขกรณี: 'แก้ไขบันทึก'
strSQL = อัปเดตชุดผู้ดูแลระบบ />กรณี: 'ลบบันทึก'
strSQL = ลบออกจากผู้ดูแลระบบ โดยที่ id = &strID
สิ้นสุดการเลือก
'ตอบกลับเขียน strSQL'
Dim strSQL,rs
โทรOpenDB()
ตั้งค่า rs = Conn.Execute (strSQL)
โทร CloseDB()
-
นี่คือโค้ดส่วนหน้า index.html
คัดลอกรหัสรหัสดังต่อไปนี้:
<!DOCTYPE html สาธารณะ -//W3C//DTD XHTML 1.0 การเปลี่ยนผ่าน//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<html xmlns=http://www.w3.org/1999/xhtml>
<หัว>
<meta http-equiv=เนื้อหาประเภทเนื้อหา=ข้อความ/html; charset=utf-8 />
<title>ASP_jqGrid_Test</title>
<ลิงค์ rel=stylesheet type=text/css href=jquery-ui-1.7.2.custom.css/>
<link rel=stylesheet type=text/css href=jqgrid.css/>
<link rel=stylesheet type=text/css href=ui.multiselect.css/>
<script type=text/javascript src=js/jquery.js></script>
<script type=text/javascript src=js/cn.js></script>
<script type=text/javascript src=js/jqGrid.js></script>
</หัว>
<ร่างกาย>
<table id=คลาส DataGrid=scroll></table>
<div id=pager class=scroll style=text-align:center;></div>
</ร่างกาย>
</html>
<ประเภทสคริปต์=ข้อความ/จาวาสคริปต์>
jQuery(#DataGrid).jqGrid({
URL:'list.asp',
ประเภทข้อมูล: json,
colNames:['ID','บัญชีผู้ดูแลระบบ','ชื่อเล่นของผู้ดูแลระบบ','รหัสผ่าน','เวลาเข้าสู่ระบบครั้งล่าสุด'],
คอลโมเดล :[
-
ชื่อ'ไอดี',
ดัชนี:'รหัส',
ความกว้าง:50
-
-
ชื่อ:'ชื่อเรื่อง',
ดัชนี:'ชื่อเรื่อง',
แก้ไขได้: จริง,
การแก้ไข:{
จำเป็น: จริง
-
-
-
ชื่อ:'ชื่อเล่น',
ดัชนี:'ชื่อเล่น',
แก้ไขได้: จริง,
การแก้ไข:{
จำเป็น: จริง
-
-
-
ชื่อ'พัท',
ดัชนี:'Pwd',
แก้ไขได้: จริง,
ประเภทการแก้ไข:'รหัสผ่าน',
ซ่อนเร้น: จริง,
การแก้ไข:{
ขนาด:20
-
การแก้ไข:{
แก้ไขแล้ว:true
-
-
-
ชื่อ: 'LastLoginTime',
ดัชนี:'LastLoginTime',
align:'ถูกต้อง',
การแก้ไข:{
จำเป็น: จริง
-
} ], คำอธิบายภาพ:รายชื่อผู้ดูแลระบบ,
imgpath:'/images',
เลือกหลายรายการ: จริง,
แถวหมายเลข:20,
แถวรายการ:[10,20,30],
เพจเจอร์: jQuery('#เพจเจอร์'),
ชื่อการจัดเรียง: 'รหัส',
บันทึกการดู: จริง,
เรียงลำดับ:รายละเอียด,
ความสูง:400,
ความกว้าง:600,
editurl:edit.asp
-
$('#DataGrid').navGrid('#เพจเจอร์',{
รีเฟรช: จริง
แก้ไข: จริง,
เพิ่ม: จริง,
เดล: จริง,
ค้นหา: จริง,
ข้อความค้นหา:ค้นหา,
แก้ไขข้อความ: เปลี่ยนแปลง, เพิ่มข้อความ: เพิ่ม, เดลเท็กซ์: ลบ
-
</สคริปต์>
jqGrid ของดี~~