jqgrid在成功进行内联更新/内联创建记录后重新加载网格

Question

我想知道如何在行内联编辑后触发reloadGrid。

<script type="text/javascript"> 

    jQuery(document).ready(function(){ 
     var lastcell; 
     jQuery("#grid").jqGrid({ 
      url:'{{ json_data_handler }}?year={{ get_param_year }}&month={{ get_param_month }}&project_id={{ get_param_project_id }}', 
      datatype: "json", 
      mtype: 'GET', 
      colNames:['hour_record_pk', 'project_pk', 'weekday', 'date', 'sum', 'description'], 
      colModel:[ 
        {name:'hour_record_pk',index:'hour_record_pk', width:55, sortable:false, editable:true, editoptions:{readonly:true,size:10}}, 
        {name:'project_pk',index:'project_pk', width:55, sortable:false, editable:true, editoptions:{readonly:true,size:10}}, 
        {name:'weekday',index:'weekday', width:300, editable:false, sortable:false}, 
        {name:'date_str',index:'date_str', width:300, editable:true, sortable:false, editoptions:{readonly:true}}, 
        {name:'sum',index:'sum', width:100, editable:true, sortable:true,editrules:{number:true,minValue:0,maxValue:24,required:true}}, 
        {name:'description',index:'description', width:600, editable:true, sortable:false,}, 
       ], 
     jsonReader : { 
       repeatitems:false 
     }, 
      rowNum:31, 
      rowList:[10,20,31], 
      //pager: jQuery('#gridpager'), 
      sortname: 'id', 
      viewrecords: true, 
      sortorder: "asc", 
      width: 800, 
      height: 750, 
      caption:"Hour Record Overview", 
      reloadAfterEdit: true, //seems to have no effect 
      reloadAfterSubmit: true, //seems to have no effect 
      onSelectRow: function(id){  
       if(id && id!==lastcell){ 
        jQuery('#grid').jqGrid('restoreRow',lastcell); 
        jQuery('#grid').jqGrid('editRow',id,true); 
        lastcell=id; 
        } 
       }, 
      editurl:"{% url set_hour_record_json_set %}" 
    }).navGrid('#gridpager'); 
    }); 

function reload(result) { 
    $("#grid").trigger("reloadGrid"); 
    } 

我已经创建了一个重载的方法，但我不知道在哪里把它放在我尝试：

jQuery('#grid').jqGrid('editRow',id,true,reload()); 

但是当用户点击进入这个已被称为行。 上面的代码允许用户点击进入一行，并在按下输入时提交数据并更新或创建记录。

用户创建一个新的对象后，我不得不重新加载网格，因为我需要新创建的对象的对象ID，以便进一步编辑此行。

编辑：解决的办法：

onSelectRow: function(row_id){ 
      if(row_id != null) { 
       if(row_id !== last_selected_row) { 
        jQuery('#grid').jqGrid('restoreRow',last_selected_row); 
        jQuery('#grid').jqGrid('saveRow',row_id) 
          .editRow(row_id, true,false,reload); 
        last_selected_row = row_id; 
       } else { 
        last_selected_row=row_id; 
       } 
       } 
      }, 

更新：供将来参考。所有以js网格开头的用户在我从jqgrid切换到slickgrid时也可能会看到Slickgrid，并且只能推荐它。

Answer 1

这里是editRow功能

jQuery("#grid_id").jqGrid('editRow', rowid, keys, oneditfunc, succesfunc, url, extraparam, aftersavefunc, errorfunc, afterrestorefunc); 

oneditfunc: fires after successfully accessing the row for editing, prior to allowing user access to the input fields. The row's id is passed as a parameter to this function.

succesfunc: if defined, this function is called immediately after the request is successful. This function is passed the data returned from the server. Depending on the data from server; this function should return true or false.

aftersavefunc: if defined, this function is called after the data is saved to the server. Parameters passed to this function are the rowid and the response from the server request.

的语法在你的情况，如果你想网后该行被保存在调用editRow方法应该如下重新加载。

jQuery('#grid').jqGrid("editRow", id, true, '', '', '', '', reload) 

我已经指派你重装函数重载为 'aftersavefunc' 参数

电网的重载方法本身应被定义如下

function reload(rowid, result) { 
    $("#grid").trigger("reloadGrid"); 
} 

Answer 2

看一看的saveRow方法：

saveRow (rowid, succesfunc, url, extraparam, aftersavefunc, onerrorfunc)

它定义了两个回调（successfuncs，aftersavefunc）被调用，当所述请求被成功地完成和后的数据已被分别保存。

Answer 3

从文档，我觉得afterSaveCell将工作最适合你（afterSubmitCell可以工作很好，但它似乎需要一个特定的返回值。afterEditCell发生之前服务器命中，这样会得很快发生）。

jQuery('#grid').jqGrid('editRow', id, true, reload); 

jQuery(document).ready(function(){ 
    var lastcell; 
    jQuery("#grid").jqGrid({ 

     // [snip earlier config] 

     onSelectRow: function(id){  
      if(id && id!==lastcell){ 
       jQuery('#grid').jqGrid('restoreRow',lastcell); 
       jQuery('#grid').jqGrid('editRow',id,true); 
       lastcell=id; 
       } 
      }, 
     editurl:"{% url set_hour_record_json_set %}", 
     onAfterSaveCell: reload 
    }).navGrid('#gridpager'); 
}); 

function reload(result) { 
    $("#grid").trigger("reloadGrid"); 
} 

但是，考虑到目前为止描述的信息，重新加载整个网格可能是过度杀毒。除非服务器端处理了提交的信息（意味着保存后数据库中的数据可能会有所不同），在简单编辑之后重新加载似乎浪费时间。

至于当你创建一个新的行时，除非服务器端只有数据管理，否则从提交中获得新的id会更容易，然后在jqGrid中进行个别更改。然而，最终它取决于重新加载整个表需要多长时间。

Answer 4

试试这个

 $("#grid").jqGrid('editRow', rowid, true, null, null, null, {}, aftersavefunc); 

// 

     function aftersavefunc(rowid, result) { 
     $("#grid").trigger("reloadGrid"); 
    } 


// 

Answer 5

Ок，现在复制粘贴的解决方案，对我来说

onSelectRow: function(id){ 
    $('#grid').jqGrid("editRow", id, true, '', '', '', '', reloadTable); 
}, 
// more confir 

// reload table after submit. Put it somewhere in your JS file 
    function reloadTable(result) { 
    $('#grid').trigger("reloadGrid"); 
    }