如何使用jqgrid中的editData或onclickSubmit发布变量数据

时间:2013-04-21 18:42:14

标签: jqgrid

我无法通过editData或onclickSubmit来完成我需要的工作。

我希望网格在更新后跟随添加或编辑的行。所以,我需要发布一些额外的信息,以便服务器可以返回添加/编辑记录的id和正确页面。

我能够使用addfunc和editfunc以及自定义表单执行此操作,但我想使用jqgrid生成的表单来完成此操作。

我在DocumentReady函数之前声明了一个全局。然后,我尝试在编辑参数中使用editData并在beforeSubmit或beforeInitData中设置变量。变量将发布到服务器,但仅在最初声明时才会发布。看起来editData是在初始化时创建的,无法更新。我也尝试过使用onclickSubmit,但也无法使用它。

这是一个经过编辑的例子:

var data2pass = {};
    data2pass['sortColumnName'] = '';
    data2pass['sortOrder'] = '';
    data2pass['rowNum'] = '';

$(document).ready(function(){

  $("#ProdGrid").jqGrid({
    url:'products_DAT.php?thespot=server_ProdGrid',
    datatype: 'json',
    mtype: 'POST',
    colNames:['ID','Product Name:','Category:','Unit Price:'],
    colModel :[ 
      {name:'ProductID', editable:true},
      {name:'ProductName', editable:true},
      {name:'CategoryID', editable:true, edittype:"select", editoptions: { dataUrl:  "products_DAT.php?thespot=select4_CategoryID" }},
      {name:'UnitPrice', align:'right', editable:true, formatter:'currency'}
    ],
    pager: '#ProdGrid_pager',
    rowNum: 15,
    sortname: 'ProductName',
    sortorder: 'asc',
    gridview: true,
    editurl: 'products_DAT.php?thespot=update_ProdGrid',
    height: 'auto'
  });

$("#ProdGrid").jqGrid('navGrid','#ProdGrid_pager', {},
{closeAfterEdit:true, reloadAfterSubmit: false, editData: data2pass,
    beforeInitData: function(formid) { 
    data2pass['sortColumnName'] = 'ProductName';
    data2pass['sortOrder'] = 'asc';
    data2pass['rowNum'] = '15';
    }
}, // Edit parameters
{}, // Add Parameters
{reloadAfterSubmit:true}, // Delete parameters
{}, // Search params
{} // View params
 );

但是,最初声明的data2pass变量是发布到服务器的内容。我应该使用什么事件来更新data2pass的值以发布到服务器?或者还有另一种更好的方法吗?

非常感谢任何建议。

由于

2 个答案:

答案 0 :(得分:4)

您可以使用函数

定义editData的属性
editData: {
    sortColumnName: function () { return "ProductName"; },
    sortOrder: function () { return "asc"; },
    rowNum: function () { return 15; }
}

或使用回调onclickSubmit扩展发布到服务器的数据

onclickSubmit: function (options, postData) {
    return {
        sortColumnName: "ProductName",
        sortOrder: "asc",
        rowNum: 15
    };
}

或使用serializeEditData回调

serializeEditData: function (postData) {
    return $.extend(true, {}, postData, {
        sortColumnName: "ProductName",
        sortOrder: "asc",
        rowNum: 15
    });
}

每个人都从上面做同样的事情。您可以选择一种最符合您要求的方式。

答案 1 :(得分:0)

我认为这应该完全符合您的要求,它会更改发送到控制器的postData变量,然后触发重新加载。

$('#gridName').jqGrid('setGridParam', { postData: { KeyName: KeyValue } }).trigger('reloadGrid', [{ page: 1}]);

如果你需要它作为编辑的一部分,你可以做几乎相同的事情

$(#gridName).jqGrid('editGridRow', rowid, { editData: { KeyName: KeyValue