1、在js中的jqGrid中下如下代码,自动生成按钮主要是colModel中最后一个name
jQuery("#table1").jqGrid(
{url:"userManageSelect.html",
datatype: "json",
mtpe:'post',
height:'100%',
colNames:['1','2','3, '4','5 ','6,'7','8','操作'],
colModel:[ //描述列信息的数组
{name:'id',index:'id', width:70,hidedlg:true,hidden:true},//id对应数据库中wxuserid,不可以修改有应用
{name:'username',index:'username', width:70,align:"center"},
{name:'usex',index:'sex', width:50,align:"center"},
{name:'phone',index:'phone', width:70,align:"center"}, //phone对应数据库中的id,不可以修改
{name:'ucardid',index:'ucardid', width:110,align:"center"},
{name:'jcardid',index:'jcardid', width:110, align:"center"},
{name:'jtype',index:'jtype', width:50,align:"center"},
{name:'jfirst',index:'jfirst', width:80, align:"center"},
{ name : 'sy',
width : 150,
align : "center",
formatter: function (value, grid, rows, state) {
var df=rows.id;
var ddd = "password('" + df + "')";
var ccc = "date('" + df + "')";
var fff = "term('" + df + "')";
return '<input id="yu'+ df+ '" type="button" name="Submit" value="初始密码" οnclick="'+ ddd + '"/>'
+' '
+'<input id="yu'+ df+ '" type="button" name="Submit" value="修改资料" οnclick="'+ ccc + '"/>'
+' '
+'<input id="yu'+ df+ '" type="button" name="Submit" value="查询报名情况" οnclick="'+ fff + '"/>'
; }
}
],
rowNum : 20,//这个参数指定了jqGrid显示行数,默认值20。,这个参数是要被传递到后台
rowList : [ 20, 30, 40,50],//一个下拉选择框,用来改变显示记录数,当选择时会覆盖rowNum参数传递到后台
pager:'#page1',
jsonReader : {//jsonReader用于设置如何解析从Server端发回来的json数据。
root : "data.list",
page : "data.curPage",//当前页
total : "data.totalPage",总页数
records : "data.totalCount",//总记录数
repeatitems : false// repeatitems如果设为false,则jqGrid在解析json时,会根据name来搜索对应的数据元素(即可以json中元素可以不按顺序);而所使用的name是来自于colModel中的name设定。
},
viewrecords : true,//定义是否要显示总记录数
forceFit : true,//当为ture时,调整列宽度不会改变表格的宽度。当shrinkToFit 为false时,此属性会被忽略
autowidth : true,// setGridWidth这个方法可以使表格跟着父容器变化
caption:"用户管理" ,
loadtext:"loading...",
});
2、在$(document).ready(function(){
});外面定义相应的方法,在方法中写点击事件
//表格1中初始化密码按钮方法
function password(id) {
var rowData = $("#table1").jqGrid('getRowData', id);
$("#userid1").val(rowData.id);
$("#username1").val(rowData.username);
$("#password_window").window("open");
}
//表格1修改资料按钮方法
function date(id) {
var rowData = $("#table1").jqGrid('getRowData', id);
$("#userid").val(rowData.id);
$("#username").val(rowData.username);
$("#usex").val(rowData.usex);
$("#phone").html(rowData.phone);
$("#ucardid").val(rowData.ucardid);
$("#jcardid").val(rowData.jcardid);
$("#jtype").val(rowData.jtype);
$("#jfirst").val(rowData.jfirst);
$("#date_window").window("open");
}