在内联编辑后重新加载jqGrid

我想在内联编辑后重新加载jqGrid，或点击一个事件，在页面上单击保存按钮后，我可以使用jQuery.data()保存一些值。我见过很多关于使用$("#gridid').edit();的讨论，但是我的jqGrid目前没有设置为使用该功能，我不确定$("#gridid').edit()将如何集成到我当前的设置中。在内联编辑后重新加载jqGrid

/*********************************************************** 
*********************jqgrid********************************* 
***********************************************************/ 
lastSel = ""; 
$(function(){ 
    var myGrid = jQuery("#list"); 
    console.log(myGrid); 

    $("#list").jqGrid({ 
    url:'php.scripts/customers.get.php', 
    datatype: 'xml', 
    mtype: 'POST', 
    colNames:['idcustomers','firstname', 'lastname','address1','address2','city','state','zip','phone','email','cell'], 
    colModel :[ 
     {name:'idcustomers', index:'idcustomers', width:55}, 
     {name:'firstname', index:'firstname', width:90, editable: true}, 
     {name:'lastname', index:'lastname', width:90, editable: true}, 
     {name:'address1', index:'address1', width:90, editable: true}, 
     {name:'address2', index:'address2', width:90, editable: true}, 
     {name:'city', index:'city', width:90, editable: true}, 
     {name:'state', index:'state', width:90, editable: true}, 
     {name:'zip', index:'zip', width:90, editable: true}, 
     {name:'phone', index:'phone', width:90, editable: true}, 
     {name:'email', index:'email', width:90, editable: true}, 
     {name:'cell', index:'cell', width:90, editable: true} 
    ], 
    pager: '#pager', 
    rowNum:20, 
    rowList:[20,100,300], 
    sortname: 'idcustomers', 
    sortorder: 'asc', 
    shrinkToFit: true, 
    viewrecords: true, 
    gridview: true, 
    caption: 'Customers', 
    width: 1400, 
    height: 290, 
    editurl: 'php.scripts/jqgrid.updaterow.php', 
    ajaxGridOptions: {type:"POST"}, 
    onSelectRow: function(id){ 
     if(id && id!==lastSel){ 
      jQuery('#list').restoreRow(lastSel); 
      lastSel=id; 
      jQuery("#list").data('selid',lastSel); 

      console.log(lastSel); 
      console.log(jQuery("#list").data('selid')); 

      $.ajax({ 
       type: "POST", 
       url: "php.scripts/customers.setid.php", 
       data: { idcustomers: jQuery("#list").data('selid') } 
      }).done(function(msg) 
      { 
       console.log(msg); 
      }); 

      jQuery('#list').data('selid', jQuery("#list").getCell(lastSel,0)); 
      jQuery('#list').data('firstname', jQuery("#list").getCell(lastSel,1)); 
      jQuery('#list').data('lastname', jQuery("#list").getCell(lastSel,2)); 
      jQuery('#list').data('address1', jQuery("#list").getCell(lastSel,3)); 
      jQuery('#list').data('address2', jQuery("#list").getCell(lastSel,4)); 
      jQuery('#list').data('city', jQuery("#list").getCell(lastSel,5)); 
      jQuery('#list').data('state', jQuery("#list").getCell(lastSel,6)); 
      jQuery('#list').data('zip', jQuery("#list").getCell(lastSel,7)); 
      jQuery('#list').data('phone', jQuery("#list").getCell(lastSel,8)); 
      jQuery('#list').data('email', jQuery("#list").getCell(lastSel,9)); 
      jQuery('#list').data('cell', jQuery("#list").getCell(lastSel,10));   
     } 
    } 
    }) 
.jqGrid('navGrid','#pager',{ edit: false, add: true, search: false }, {}, {}, {}, {}, {}) 
.jqGrid('inlineNav',"#pager",{}) 
.jqGrid('navButtonAdd',"#pager",{caption:"Toggle",title:"Toggle Search Toolbar", buttonicon :'ui-icon-pin-s', 
    onClickButton:function(){ 
     myGrid[0].toggleToolbar() 
    } 
}) 
.jqGrid('navButtonAdd',"#pager",{caption:"Clear",title:"Clear Search",buttonicon :'ui-icon-refresh', 
    onClickButton:function(){ 
     myGrid[0].clearToolbar(); 
     jQuery('#list').data('selid', ""); 
     jQuery('#list').data('firstname', ""); 
     jQuery('#list').data('lastname', ""); 
     jQuery('#list').data('address1', ""); 
     jQuery('#list').data('address2', ""); 
     jQuery('#list').data('city', ""); 
     jQuery('#list').data('state', ""); 
     jQuery('#list').data('zip', ""); 
     jQuery('#list').data('phone', ""); 
     jQuery('#list').data('email', ""); 
     jQuery('#list').data('cell', ""); 
    } 
}) 
.jqGrid('filterToolbar'); 

/*********************************************************** 
*********************jqgrid********************************* 
***********************************************************/

来源

2013-05-03 Giuseppe

希望这有助于你 -

onSelectRow : function(rowid){ 
      if(rowid && rowid!== lastsel){ 
       $("#datagrid").jqGrid('restoreRow',lastsel); 
       $("#datagrid").jqGrid('editRow',rowid,true); 
       lastsel = rowid; 
      } 
     },

editrow方法触发jqgrid与编辑后的数据，并传递一个额外的参数OPER到网址和所有它所选行的数据。在editurl选项你的网址包含一个参数与操作，所以通过在服务器端使用这个参数，你可以更新你的数据在php中的数据库。没有必要为此使用ajax调用。

来源

2013-05-04 12:00:20 ruchi

在内联编辑后重新加载jqGrid

回答

相关问题