如何在 free-jqgrid 中为行 edit/save 操作传递额外参数？

Question

我有一个jgrid，代码如下。单击每行中的保存图标时，我希望向服务器发送一些额外的参数。如何做到这一点？

let colNames = ['Designation', 'No. of Resource(s) Required', 'Competence for Job', 'Skill of Resource', 'Time Required(in %)', 'From', 'To', 'Reason For Request', 'Assigned Person(s)', 'Current Role in Project', 'resource_type', 'Billing'];

    let colModel = [
        {name:'resource_designation', index:'resource_designation', resizeable:true, editable: true, edittype: 'select', editoptions: {value:designation_options}, editrules:{required:true}, search: false},
        {name:'resource_resources_required', index:'resource_resources_required', resizeable:true, editable: true, edittype: 'text', editrules:{required:true}, search: false},
        {name:'resource_competence_for_job', index:'resource_competence_for_job', resizeable:true, editable: true, edittype: 'textarea', search: false},
        {name:'resource_skill_of_resource', index:'resource_skill_of_resource', resizeable:true, editable: true, edittype: 'textarea', search: false},
        {name:'resource_percentage_time_required', index:'resource_percentage_time_required', resizeable:true, editable: true, edittype: 'text', editrules:{required:true, integer: true}, search: false},
        {name:'resource_duration_from', index:'resource_duration_from', resizeable:true, editable: true, edittype: 'text', editoptions: {
            dataInit: function(el){
                $(el).datepicker({
                    id: 'resource_duration_from',
                    dateFormat: "dd-M-yy"
                });
            }
        }, search: false},
        {name:'resource_duration_to', index:'resource_duration_to', resizeable:true, editable: true, edittype: 'text', editoptions: {
            dataInit: function(el){
            $(el).datepicker({
                id: "resource_duration_to",
                dateFormat: "dd-M-yy"
            });
            }
        }, search: false},
        {name:'resource_reason_for_request', index:'resource_reason_for_request', resizeable:true, editable: true, edittype: 'text', editrules:{required:true}, search: false},
        //{name:'assigned_persons', index:'assigned_persons', resizeable:true, editable: true, edittype: 'select', editrules:{required:true}, search: false},
        {name:'resource_assigned_persons', index:'resource_assigned_persons', resizeable:true, editable: true, edittype: 'select', editoptions:{value:assigned_persons}, editrules: {required: true},  search: false},
        //{name:'current_role', index:'current_role', resizeable:true, editrules:{required:true}, search: false},
        {name:'resource_current_role_in_project', index:'resource_current_role_in_project', resizeable:true, editable: true, edittype: 'select', editoptions: {value: designation_options}, editrules:{required:true}, search: false},
        {name:'resource_resource_type', index:'resource_resource_type', resizeable:true, editable: true, edittype: 'select', editoptions: {value: {"Full Time": "Full Time", "Buffer": "Buffer", "Trainee": "Trainee"}}, editrules:{required:true}, search: false},
        {name:'resource_billing', index:'resource_billing', resizeable:true, editable:true, edittype:'select', editoptions: {value:{"Billable": "Billable", "Non-Billable": "Non-Billable"}}, search: false}
    ];


    let editparameters = {
            "keys" : false,
            "oneditfunc" : null,
            "successfunc" : null,
            "url" : location_url,
             "extraparam" : {"grid": "rsf_people"},
            "aftersavefunc" : null,
            "errorfunc": null,
            "afterrestorefunc" : null,
            "restoreAfterError" : true,
            "mtype" : "POST"
        };

    let parameters = {
               edit: true,
               editicon: "ui-icon-pencil",
               add: true,
               addicon:"ui-icon-plus",
               save: true,
               saveicon:"ui-icon-disk",
               cancel: true,
               cancelicon:"ui-icon-cancel",
               //addParams : saveparameters,
               addParams : {addRowParams:{extraparam:{"grid":"rsf_people"}}},
               editParams : editparameters
            };





$("#rsf_people").jqGrid({
    url: location_url,
    datatype: "json",
    mtype: "POST",
    postData: {action: "get_saved_allocated_resources"},
    colNames:people_colNames,
    colModel:people_colModel,
    rowNum: 5,
    height:'auto',
    autowidth: true,
    shrinkToFit: true,
    pager: true,
    emptyrecords: " ",
    viewrecords: true,
    sortorder: "asc",
    scrollOffset:0,
    cmTemplate: { autoResizable: true, editable: true },
    autoResizing: { compact: true, resetWidthOrg: true },
    idPrefix: "g1_",
    autoencode: true,
    sortable: true,
    rownumbers: true,
    pagerRightWidth: 150,
    editurl: location_url,
    afterAddRow: function () {
        recreateFilterToolbar.call(this);
    },
    afterSetRow: function () {
        recreateFilterToolbar.call(this);
    },
    afterDelRow: function () {
        recreateFilterToolbar.call(this);
    },
    inlineEditing: {
        keys: true
    },
    formEditing: {
        width: 310,
        closeOnEscape: true,
        closeAfterEdit: true,
        savekey: [true, 13]
    },
    loadonce: true,
    caption: "RSF People",
}).jqGrid("navGrid", {add: false, edit: false, del: false, search: false, refresh: false})
            .jqGrid("inlineNav", parameters)
            .jqGrid("filterToolbar");

/* To make grouped headers */
$("#rsf_people").jqGrid("setGroupHeaders", {
    useColSpanStyle: false,
    groupHeaders: [
        {startColumnName: 'duration_from', numberOfColumns: 2, titleText: 'Duration'},
    ]
});

我的网格如下所示，

如果您查看图片，我在 green 中标记了 inlinenav 操作，例如添加和编辑。所以这些效果很好，我可以使用变量 parameters.

传递额外的参数

但我想将那些相同的额外参数传递给图片中红色矩形中标记的编辑操作。我该怎么做？

换句话说，当我单击绿色底部区域中的“+”图标时，它会在网格中添加一个新行，并在左侧添加一个保存图标行的一侧[操作列]。如果我填写数据并单击同一行左侧的保存图标，它不会将额外参数传递给服务器。我怎样才能做到这一点？我希望在单击保存[存在于每一行中 - 在图像中标记为红色] 图标时传递额外参数。

如何实现？请帮助我！

Answer 1

如果我正确理解您的代码，您希望将 grid=rsf_people 作为额外数据发送，以在“添加”和“编辑”操作的情况下保存内联数据。目前您仅为 inlineNav 设置了 extraparam。因此，如果仅在导航栏中而不是在“操作”格式化程序中使用“保存”图标，则会发送额外的数据。

免费的 jqGrid 支持 inlineEditing 参数（请参阅代码中的 inlineEditing: { keys: true }），这简化了将参数转发到内联编辑方法的过程。我建议你使用

inlineEditing: {
    extraparam: { grid: "rsf_people" },
    mtype: "POST",
    keys: true
}

应该可以解决您的问题。有关详细信息，请参阅 the wiki article。

如何在 free-jqgrid 中为行 edit/save 操作传递额外参数？

How to pass extra parameters for in row edit/save action in free-jqgrid?

jquery

free-jqgrid