CodeIgniter with Jqgrid

I've been working on jqGrid for 开发者_JAVA百科the last 3 days.

I've been able to populate the grid, but now I can't get to work the buttons/features of the jqGrid like add, edit, save or even delete a row.

Any suggestion/opinions on how to do this will be really helpful.

btw- I'm using codeigniter with jqGrid

this is my js file

$("#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!");
}); 

view file

<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-->

Maybe it is that you are not including jqModal.js and jqDnR.js. They are located in src

$("#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");
});

test this

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");
 }); 

try this library+helper to implement jqgrid with codeigniter http://blog.markmirandilla.com/2011/09/04/codeigniter-jqgrid-library/