asp.net-mvc – 如何提交本地jqgrid数据和表单输入元素

var localGridData = $("#list").jqGrid('getGridParam','data');

如果您只需要发送网格行的子集,就像仅选择行一样,则需要获取_index：

var idsToDataIndex = $("#list").jqGrid('getGridParam','_index');

要将数据发送到服务器,您可以使用以下功能

var sendData = function(data) {
    var dataToSend = JSON.stringify(data);
    alert("The following data are sending to the server:n" + dataToSend);
    $.ajax({
        type: "POST",url: "yourServerUrl",dataType:"json",data: dataToSend,contentType: "application/json; charset=utf-8",success: function(response,textStatus,jqXHR) {
            // display an success message if needed
            alert("success");
        },error: function(jqXHR,errorThrown) {
            // display an error message in any way
            alert("error");
        }
    });
};

在the demo中,您将找到一个更复杂的示例,其中包含两个按钮：“发送所有网格包含”,“发送所选行”.相应的代码如下

$("#sendAll").click(function(){
    var localGridData = grid.jqGrid('getGridParam','data');
    sendData(localGridData);
});
$("#sendSelected").click(function(){
    var localGridData = grid.jqGrid('getGridParam','data'),idsToDataIndex = grid.jqGrid('getGridParam','_index'),selRows = grid.jqGrid('getGridParam','selarrrow'),dataToSend = [],i,l=selRows.length;
    for (i=0; i<l; i++) {
        dataToSend.push(localGridData[idsToDataIndex[selRows[i]]]);
    }
    sendData(dataToSend);
});

哪里

var grid = $("#list"),decodeErrorMessage = function(jqXHR,errorThrown) {
        var html,errorInfo,errorText = textStatus + 'n<br />' + errorThrown;
        if (jqXHR.responseText.charAt(0) === '[') {
            try {
                errorInfo = $.parseJSON(jqXHR.responseText);
                errorText = "";
                for (i=0; i<errorInfo.length; i++) {
                   if (errorText.length !== 0) {
                       errorText += "<hr/>";
                   }
                   errorText += errorInfo[i].Source + ": " + errorInfo[i].Message;
                }
            }
            catch (e) { }
        } else {
            html = /<body.*?>([sS]*)</body>/i.exec(jqXHR.responseText);
            if (html !== null && html.length > 1) {
                errorText = html[1];
            }
        }
        return errorText;
    },sendData = function(data) {
        var dataToSend = JSON.stringify(data);
        alert("The following data are sending to the server:n"+dataToSend);
        $.ajax({
            type: "POST",jqXHR) {
                // remove error div if exist
                $('#' + grid[0].id + '_err').remove();
                alert("success");
            },errorThrown) {
                // remove error div if exist
                $('#' + grid[0].id + '_err').remove();
                // insert div with the error description before the grid
                grid.closest('div.ui-jqgrid').before(
                    '<div id="' + grid[0].id + '_err" style="max-width:' + grid[0].style.width +
                    ';"><div class="ui-state-error ui-corner-all" style="padding:0.7em;float:left;"><span class="ui-icon ui-icon-alert" ' +
                    'style="float:left; margin-right: .3em;"></span><span style="clear:left">' +
                    decodeErrorMessage(jqXHR,errorThrown) + '</span></div><div style="clear:left"/></div>');
            }
        });
    };

我认为,您将在服务器上遇到更困难,更复杂的问题.在并发错误的情况下,但我之前写过关于这些问题的文章.正是因为我个人永远不会在服务器上实现多行保存的问题.

更新：要从表单中获取数据,您可以使用jQuery.serialize.您应该对要序列化的表单中的所有字段使用name属性.您需要发送的所有数据

var allData = {
    localGridData: grid.jqGrid('getGridParam',formData: $("#formid").serialize()
};

您可以像我之前描述的那样发送数据：sendData(allData).