Question

过去3天我一直在研究jqGrid。

我已经能够填充网格，但现在我无法使用jqGrid的按钮/功能，如添加，编辑，保存甚至删除行。

关于如何做到这一点的任何建议/意见都会非常有用。

btw-我正在使用codeigniter和jqGrid

这是我的js文件

$("#listFlex").jqGrid({
    url: root + mod + '/listview2',
    datatype: "json",
    colNames:['','role_code','role_description'],
    colModel:[
        {name:'role_id',index:'role_id', width:50, align:"center",hidden:true},
        {name:'role_code',index:'role_code', width:80},
        {name:'role_desc',index:'role_desc', width:100,align:"left"}
    ],
    buttons : [
        {name: $.i18n._(action_lang,'delete'), bclass: 'delete', onpress: df_delete_1},
        {separator: true}
    ],
    rowNum:10,
    rowList:[10,20,30],
    pager: '#pager2',
    sortname: 'role_id',
    viewrecords: true,
    sortorder: "desc",
    onSelectRow: function(id){
        if(id && id!==lastsel){
            jQuery('#listFlex').jqGrid('restoreRow',lastsel);
            jQuery('#listFlex').jqGrid('editRow',id,true);
            lastsel=id;
        }
    },
    autowidth: true,
    height: "200",
    viewrecords: true,
    sortorder: "desc",
    caption:"JSON Example",
    editurl:"sec_role/post"
});

jQuery("#listFlex").jqGrid('navGrid','#pager2',{edit:true,add:true,del:true});

//edit data
$("#bedata").click(function(){
    var gr = jQuery("#listFlex").jqGrid('getGridParam','selrow');
    if( gr != null )
        jQuery("#listFlex").jqGrid('editGridRow',gr,{height:280,reloadAfterSubmit:false});
    else
        alert("Please Select Row");
});

$("#dedata").click(function(){
    var gr = jQuery("#listFlex").jqGrid('getGridParam','selrow');
    if( gr != null )
        jQuery("#listFlex").jqGrid('delGridRow',gr,{reloadAfterSubmit:false});
    else
        alert("Please Select Row to delete!");
});

查看文件

<table id="listFlex" class="listFlex" cellpadding="0" cellspacing="0"></table>
<div id="pager2" class="scroll" style="text-align: center;"></div>
<input type="BUTTON" id="bedata" value="Edit Selected" /> <!--edit-->
<input type="BUTTON" id="dedata" value="Delete Selected" /><!-- add-->

Answer 1

也许是你不包括jqModal.js和jqDnR.js。它们位于src

Answer 2

$("#bedata").click(function(){
    var gr = ***jQuery("#listFlex").jqGrid('getGridParam','selrow');***
    if( gr != null )
        jQuery("#listFlex").jqGrid('editGridRow',gr,{height:280,reloadAfterSubmit:false});
    else
        alert("Please Select Row");
});

测试这个

jQuery("#bedata").click(function()
 { var gr = ***jQuery("#listFlex").getGridParam('selrow');***
 if( gr != null ) jQuery("#listFlex").editGridRow(gr,{height:280,reloadAfterSubmit:false});
  else alert("Please Select Row");
 });

Answer 3

尝试使用此库+帮助器来实现带有codeigniter的jqgrid http://blog.markmirandilla.com/2011/09/04/codeigniter-jqgrid-library/

带有Jqgrid的CodeIgniter

3 个答案: