jqGrid 表格插件

jqGrid 是一個用來顯示網格數據的jQuery插件,通過使用jqGrid可以輕鬆實現前端頁面與後臺數據的ajax異步通信。




$(document).ready(function(){
    $("#list4").jqGrid({
        url:contextPath + "search.action",
        datatype:"json", //數據來源,本地數據
        mtype:"POST",//提交方式
        height:420,//高度,表格高度。可爲數值、百分比或'auto'
        //width:1000,//這個寬度不能爲百分比
        autowidth:true,//自動寬
        colNames:['添加日期', '手機號碼', '銀行卡號','備註','操作'],
        colModel:[
            //{name:'id',index:'id', width:'10%', align:'center' },
            {name:'createDate',index:'createDate', width:'20%',align:'center'},
            {name:'phoneNo',index:'phoneNo', width:'15%',align:'center'},
            {name:'cardNo',index:'cardNo', width:'20%', align:"center"},
            {name:'remark',index:'remark', width:'35%', align:"left", sortable:false},
            {name:'del',index:'del', width:'10%',align:"center", sortable:false}
        ],
        rownumbers:true,//添加左側行號
        //altRows:true,//設置爲交替行表格,默認爲false
        //sortname:'createDate',
        //sortorder:'asc',
        viewrecords: true,//是否在瀏覽導航欄顯示記錄總數
        rowNum:15,//每頁顯示記錄數
        rowList:[15,20,25],//用於改變顯示行數的下拉列表框的元素數組。
        jsonReader:{
            id: "blackId",//設置返回參數中,表格ID的名字爲blackId
            repeatitems : false
        },
        pager:$('#gridPager')
    });
});






發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章