复制代码 代码如下: jqGrid的JSON数据显示 <BR>body{font-size:12px;} <BR> <BR>function Modify(id) { //单击修改链接的操作 <BR>var model = jQuery("#list1").jqGrid('getRowData', id); <BR>//alert(model.Id); <BR>$("#txtCityCode").val(model.Code); <BR>$("#txtCityName").val(model.Name); <BR>$("#txtFID").val(model.Fid); <BR>$("#modifyform").dialog({ <BR>height:230, <BR>width:400, <BR>resizable:false, <BR>modal:true, //这里就是控制弹出为模态 <BR>buttons:{ <BR>"确定":function(){ <BR>alert("在这里对数据进行修改！"); <BR>$(this).dialog("close"); <BR>}, <BR>"取消":function(){$(this).dialog("close");} <BR>} <BR>}); <BR>} <BR>function Delete(id) { //单击删除链接的操作 <BR>alert("在这里执行异步删除操作，此时点击了id为 "+id+" 的行！"); <BR>} <BR>$(document).ready(function(){ <BR>$("#list1").jqGrid({ <BR>url:'JsonDataHandler2.aspx', <BR>datatype:"json", <BR>mtype:'GET', <BR>height:200, <BR>colNames:['编号','城市编号','城市名称','所属省份编号','修改','删除'], //注意在colNames和colModel中都不要忘记加修改和删除这两列 <BR>colModel:[ <BR>{name:'Id',index:'Id',width:55}, <BR>{name:'Code',index:'Code',width:100}, <BR>{name:'Name',index:'Name',width:180, sortable:false}, <BR>{name:'Fid',index:'Fid',width:180}, <BR>{name:'Modify',index:'Id',width:80,align:"center",sortable:false}, <BR>{name:'Delete',index:'Id',width:80,align:'center',sortable:false} <BR>], <BR>//autowidth:true, <BR>jsonReader:{ <BR>page:"page", <BR>total:"total", <BR>repeatitems:false, <BR>id:"Id" <BR>}, <BR>pager:jQuery('#pager1'), <BR>rowNum:20, <BR>rowList:[10,20,30], <BR>sortname:'Id', <BR>sortorder:'asc', <BR>viewrecords:true, <BR>caption:'jqGrid使用JSON数据测试', <BR>gridComplete:function(){ //在此事件中循环为每一行添加修改和删除链接 <BR>var ids=jQuery("#list1").jqGrid('getDataIDs'); <BR>for(var i=0; i<ids.length; i++){ <BR>var id=ids[i]; <BR>modify ="<a href='#' style='color:#f60' onclick='Modify("+ id +")'>修改"; //这里的onclick就是调用了上面的javascript函数 Modify(id) <BR>del ="<a href='#' style='color:#f60' onclick='Delete("+ id +")' >删除"; <BR>jQuery("#list1").jqGrid('setRowData', ids[i], { Modify: modify, Delete: del }); <BR>} <BR>} <BR>}).navGrid("#pager1",{edit:false,add:false,del:false,search:false}); <br><br>}); <BR> 城市编号： 城市名称： 所属省份编号：
