内联创建记录后重新加载网格

内联创建记录后重新加载网格

本文介绍了jqgrid 在成功内联更新/内联创建记录后重新加载网格的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

<script type="text/javascript">jQuery(文档).ready(函数(){var lastcell;jQuery("#grid").jqGrid({url:'{{ json_data_handler }}?year={{ get_param_year }}&month={{ get_param_month }}&project_id={{ get_param_project_id }}',数据类型:json",mtype: 'GET',colNames:['hour_record_pk', 'project_pk', 'weekday', 'date', 'sum', 'description'],col型号:[{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:{重复项目:假},行号:31,行列表:[10,20,31],//pager: jQuery('#gridpager'),排序名称:'id',观看记录:真实,排序顺序:asc",宽度:800,身高:750,标题:小时记录概述",reloadAfterEdit: true,//好像没有效果reloadAfterSubmit: true,//好像没有效果onSelectRow:函数(id){if(id && id!==lastcell){jQuery('#grid').jqGrid('restoreRow',lastcell);jQuery('#grid').jqGrid('editRow',id,true);最后一个单元格=id;}},editurl:"{% url set_hour_record_json_set %}"}).navGrid('#gridpager');});函数重载(结果){$("#grid").trigger("reloadGrid");}

我已经创建了一个 reload 方法,但我不知道把它放在哪里.我试过了:

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

但是当用户点击一行时,这已经被调用了.上面的代码允许用户点击一行,当按下回车键时,数据被提交并更新或创建记录.

用户创建新对象后,我必须重新加载网格,因为我需要新创建对象的对象 ID,以便进一步编辑该行.

解决方案:

onSelectRow: function(row_id){如果(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;} 别的 {last_selected_row=row_id;}}},

更新:供将来参考.当我从 jqgrid 切换到 slickgrid 并且只能推荐它.

解决方案

这里是editRow函数的语法

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

oneditfunc:成功后触发访问行进行编辑,之前允许用户访问输入字段.行的 id 作为这个函数的参数.

succesfunc:如果定义了这个函数之后立即调用请求成功.这个功能传递从返回的数据服务器.根据来自的数据服务器;这个函数应该返回真假.

aftersavefunc:如果已定义,则此数据后调用函数保存到服务器.传递的参数这个函数是rowid和来自服务器请求的响应.

如果您想在保存行后重新加载网格,则对 editRow 方法的调用应如下所示.

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

我已经分配了您的 reload 函数,它会为 'aftersavefunc' 参数重新加载网格

reload 方法本身应该定义如下

函数重载(rowid,结果){$("#grid").trigger("reloadGrid");}

I'm wondering how I can trigger reloadGrid after an inline edit of a row.

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

I created already a reload method but I'm not sure where to put it in. I tried:

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

but this is already called when the user clicks into a row.The code above allows the user to click into a row and when pressing enter the data is submitted and the record updated or created.

After the user created a new object I have to reload the grid, since I need the object id of the newly created object, in order to take care of further editing this row.

Edit: The solution:

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;
                }
              }
            },

Update: For future reference. All users starting with js grids might also have a look at Slickgrid as I switched from jqgrid to slickgrid and can only recommend it.

解决方案

Here is the syntax of the editRow function

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

In your case if you want to grid reloaded after the row is saved the call to editRow method should read as follows.

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

I have assigned your reload function which reloads the grid for 'aftersavefunc' parameter

the reload method itself should be defined as follows

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

这篇关于jqgrid 在成功内联更新/内联创建记录后重新加载网格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-24 09:32