Question

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

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

Answer 1

希望这能帮到你 -

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

editrow方法使用已编辑的数据触发jqgrid，并将一个额外的参数oper传递给url，并将所有选择的行数据传递给url。在editurl选项中，您的url包含一个带oper的参数，因此通过在服务器端使用此参数，您可以在php中更新数据库中的数据。没有必要使用ajax调用。

在内联编辑后重新加载jqGrid

1 个答案: