Как передать данные формы и данные jqGrid (editUrl) в контроллер одновременно - PullRequest
5 голосов
/ 15 декабря 2011

У меня есть приложение asp.net MVC3 с различными битами данных формы и jqGrid.

Когда я редактирую строку в jqGrid, мне нужно опубликовать данные сетки, а также некоторые части формына контроллер editUrl.

Я могу опубликовать отредактированные данные jqGrid на свой контроллер через editUrl, просто отлично.

Есть ли способ сделать это?

Я не уверенкак отправить другие элементы формы и как получить их в моем контроллере.

Любая помощь будет принята с благодарностью.

Ниже мой jqGrid:

    $("#jqTable").jqGrid({
        // Ajax related configurations
        url: '@Url.Action("_CustomBinding")',
        datatype: "json",
        mtype: "POST",
        postData: {
            programID: function () { return $("#ProgramID option:selected").val(); },
            buildID: function () { return $('#Builds option:selected').val(); }
        },

        // Specify the column names
        colNames: ["Actions", "Assembly ID", "Assembly Name", "Assembly Type", "Cost", "Order", "Budget Report", "Partner Request", "Display"],

        // Configure the columns
        colModel: [
        { name: 'myac', width: 80, fixed: true, sortable: false, resize: false, formatter: 'actions', formatoptions: { keys: true} },
        { name: "AssemblyID", key: true, index: "AssemblyID", width: 40, align: "left", editable: false },
        { name: "AssemblyName", index: "AssemblyName", width: 100, align: "left", editable: true, edittype: 'select',
            editoptions: {
                dataUrl: '@Url.Action("_Assemblies")',
                buildSelect: function (data) {
                    var response = jQuery.parseJSON(data);
                    var s = '<select>';
                    if (response && response.length) {
                        for (var i = 0, l = response.length; i < l; i++) {
                            var ri = response[i];
                            s += '<option value="' + ri + '">' + ri + '</option>';
                        }
                    }
                    return s + "</select>";
                }
            }
        },
        { name: "AssemblyTypeName", index: "AssemblyTypeName", width: 100, align: "left", editable: false, edittype: 'select' },
        { name: "AssemblyCost", index: "AssemblyCost", width: 50, align: "left", formatter: "currency", editable: true },
        { name: "AssemblyOrder", index: "AssemblyOrder", width: 50, align: "left", editable: true },
        { name: "AddToBudgetReport", index: "AddToBudgetReport", width: 100, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox' },
        { name: "AddToPartnerRequest", index: "AddToPartnerRequest", width: 100, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox' },
        { name: "Show", index: "Show", width: 50, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox'}],

        // Grid total width and height and formatting
        //width: 650,
        //height: 220,
        altrows: true,

        // Paging
        //toppager: true,
        pager: $("#jqTablePager"),
        rowNum: 10,
        rowList: [10, 20, 30],
        viewrecords: true, // Specify if "total number of records" is displayed
        emptyrecords: 'No records to display',

        // Default sorting
        sortname: "AssemblyID",
        sortorder: "asc",

        // Grid caption
        caption: "Build Template",

        // grid command functionality
        editurl: '@Url.Action("_AjaxUpdate")',
        onSelectRow: function (AssemblyID) {
            if (AssemblyID && AssemblyID !== lastsel) {
                $('#jqTable').jqGrid('restoreRow', lastsel);
                $("#jqTable").jqGrid('editRow', AssemblyID, true);
                lastsel = AssemblyID;
            }
        }
    }).navGrid("#jqTablePager",
        { refresh: false, add: false, edit: false, del: false },
            {}, // settings for edit
            {}, // settings for add
            {}, // settings for delete
            {sopt: ["cn"]} // Search options. Some options can be set on column level
     );

Ответы [ 2 ]

5 голосов
/ 15 декабря 2011

Вы можете настроить то, что отправляется на сервер, используя параметр onclickSubmit:

.navGrid("#jqTablePager",
    { refresh: false, add: false, edit: false, del: false },
        { // settings for edit
            onclickSubmit: function(params, postdata)
            {
                postdata.extraParam = 'value'
            }
        },
        {}, // settings for add
        {}, // settings for delete
        {sopt: ["cn"]} // Search options. Some options can be set on column level
 );

Контроллер получит объект JSON, содержащий все отредактированные свойства + extraParam. Вам решать, как вы справитесь с этим на стороне сервера.

4 голосов
/ 15 декабря 2011

Я вижу, вы уже используете свойства programID и buildID, определенные как функции. Функции будут вызываться при каждом запросе, чтобы получить данные для сетки. Таким же образом вы можете использовать inlineData или extraparam параметр editRow , который вы явно вызываете внутри вашего onSelectRow обратного вызова.

Попробуйте вызвать демо , которое имеет следующие параметры jqGrid:

inlineData: {
    myParam: function () {
        alert("inlineData is calling!!!");
        return "OK";
    }
},
onSelectRow: function (id) {
    if (id && id !== lastSel) {
        $(this).jqGrid('restoreRow', lastSel);
        $(this).jqGrid('editRow', id, true, null, null, null, {
            myNextParam: function () {
                alert("extraparam of 'editRow' is calling!!!");
                return "Fine";
            }
        });
        lastSel = id;
    }
}

Вы увидите два оповещения, если сохраните данные строки редактирования. В моей демонстрации я использовал editurl: 'myDummyUrl', который не имеет кода на стороне сервера, и вы увидите ошибку в конце, но если вы изучите трафик HTTP (относительно Fiddler или Firebug ) вы увидите, что следующие дополнительные параметры будут отправлены на editurl:

myParam=OK&myNextParam=Fine

Я думаю, это то, что вам нужно.

inlineData:{}

работает нормально для получения работы перед переходом к контроллеру во время редактирования. Но в случае удаления, как получить событие, как раньше, передать управление контроллеру для создания json, после нажатия на удаление.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...