重新加载数据和afterSubmit, aftersavefunction函数不工作在jqGrid使用MVC内联RowA

Question

我正在使用jqGrid并进行内联编辑和行添加。我设置一切在客户端使用Javascript和MVC使用c#为服务器端代码。除了内联保存和添加行函数从服务器返回之外，一切似乎都很正常。如果保存失败或出错，客户端似乎仍然不知道响应。我设置了一些基本函数来处理afterSubmit、afterSave等操作，但它工作的唯一实例是在刷新操作上。每当编辑或添加一行时，响应似乎不会返回，网格也不会刷新。

我在这方面发现的一切都是网格的基本设置来处理这个问题，但我担心我可能不会返回适当的响应或我的一些函数设置不正确。我已经阅读了wiki文档和论坛上的几个帖子，但是信息中的空白让我遇到了同样的问题。

只是为了明确编辑和添加工作良好，手动刷新等。唯一的问题是从服务器返回一个响应，并在编辑完成后重新加载网格中的数据。

这是我的客户端代码相关的网格和功能:

我AfterFunctions

:

var actionAfterSubmit = function (response, postdata) {
    var res = response.responseText;
    alert('In actionAfterSubmit');
    return [true, ''];
};
var actionbeforeSubmit = function (response, postdata) {
    //var res = response.responseText;
    alert('In beforeSubmit');
    return true;
};
var actionAfterSave = function (rowid, response) {
    alert('In actionAfterSave');
};
var actionErrorFunc = function (rowid, response) {
    alert('In actionErrorFunc');
};
var actionSuccessFunc = function (response) {
    alert('In actionSuccessFunc');
    return true;
};      

我的网格:

jQuery("#list").jqGrid({
        url: ServiceURL + '/Controller/GetDataAction', //URL that loads data including search functionality
        datatype: 'json',
        mtype: 'GET',
        postData: { tableName: t_Name },
        editData: { tableName: t_Name },
        colModel: col_model, //col_model is passed as parameter
        pager: jQuery('#pager'), //sets pager name
        rowNum: 20, //default number of rows
        rowList: [10, 20, 50, 100], //number of row options
        sortname: 'id', //sorting columns
        sortorder: "asc", //sorting order
        viewrecords: true,
        altRows: true, //enables different styling for alternate rows
        altclass: 'myAltRowClass', //Alternate row styling
        width: "100%",
        height: "100%",
        caption: '',
        navigator: true, //enables navigator toolbar
        multipleSearch: true, //enables multiple search features
        multipleGroup: true, //enables grouping in multiple search
        editurl: ServiceURL + '/Controller/GridSaveAction' //URL that handles edit (insert & update) }); var editOptions = {
        width: 400,
        height: 'auto',
        addCaption: "Add Record",
        editCaption: "Edit Record",
        bSubmit: "Submit",
        bCancel: "Cancel",
        bClose: "Close",
        saveData: "Data has been changed!",
        bYes: "Yes",
        bNo: "No",
        bExit: "Cancel",
        recreateForm: true,
        url: ServiceURL + '/ICMP/MapTable/GridSave/',
        reloadAfterSubmit: true,
        closeOnEscape: true,
        closeAfterEdit: true,
        viewPagerButtons: false,
        afterSubmit: actionAfterSubmit,
        afetrsavefunc: actionAfterSave,
        reloadAfterSubmit: true,
        datatype: 'json'
    };

我的参数和其他网格设置:

var addOptions = {
        afterSubmit: actionAfterSubmit,
        aftersavefunc: actionAfterSave,
        errorfunc: actionErrorFunc,
        successfunc: actionSuccessFunc,
        afterComplete: refreshTableAfterAddOrEdit,
        reloadAfterSubmit: true
    };  
var addParameters = {
        useFormatter: true,
        defaultValue: "",
        useDefValues: true,
        initdata: { tableName: t_Name },
        addRowParams: editOptions,
        reloadAfterSubmit: true  };      
var inlineParameters = {
        edit: false,
        editicon: "ui-icon-pencil",
        save: false,
        saveicon: "ui-icon-disk",
        cancel: false,
        cancelicon: "ui-icon-cancel",
        add: true,
        addicon: "ui-icon-plus",
        addParams: addParameters,
        editParams: editOptions,
        reloadAfterSubmit: true,
        restoreAfterSelect: false            
    };

jQuery("#list").jqGrid('navGrid', '#pager', { view: true, edit: true, add: false, del: false, refresh: true, search: true }, editOptions, addParameters, {}, searchOptions, viewOptions);
jQuery("#list").jqGrid('inlineNav', '#pager', inlineParameters);
jQuery("#list").jqGrid('filterToolbar', {
        stringResult: true, searchOnEnter: false, defaultSearch: "cn",
        beforeSearch: function() {
            $("#list").setGridParam({ postData: { _search: true, tableName: t_Name } });
        }    
    });
jQuery("#list").jqGrid('addRow', {
        useFormatter: true,
        useDefValues: true,
        initdata: { tableName: t_Name },
        addRowParams: addParameters
    });

这是我的控制器

public JsonResult GridSaveAction(string id, jqGridMapTableModel MapRecord, string tableName, FormCollection formCollection, string someVal)
    {
        //Does some things
        try
        {                
          //Sets up update 
          success = DataAccessObject.Update(Query, myParameters); //Runs the update and returns true if success or false if it failed
        }
        catch (Exception ex) {
             return Json(ex.Message);    
        } 
        return Json(success ? "Operation succesful." : "Operation failed.");
    }

我一直在尝试我能找到的一切，但没有工作，我认为我的代码的某些部分是错误的。

任何帮助都非常感谢!

Answer 1

终于找到了拼图中缺失的那一块!!当使用内联编辑和操作按钮列时， onsuccess 、onError和afterSave函数必须硬编码到网格的列模型中。

在我的例子中，我使用网格中的"Actions"列来容纳带有按钮的编辑功能。这是带有铅笔图标的按钮，用于启用内联编辑。

此列使用formatter = "actions"并有其EditActionIconsColumn = true。我必须定义

formatoptions ={
afterSave: function (rowid) { $("#grid").trigger("reloadGrid"); }, 
...
}

所有这些都是在列模型中为我的"Actions"列定义的。

jQGrid脚本在通过这些按钮进行内联编辑时只使用这些方法，而忽略您可能已经设置此功能的任何其他地方。

就是这样。没有其他复杂的代码，没有内联保存功能的手动编码。任何其他代码都可以在这里实现，以及任何其他功能，如onError或onSuccess。

Answer 2

当你正在处理返回Json消息的异常时，你的"actionErrorFunc"没有被调用。尝试抛出异常，看看是否会触发函数。

下面是一个示例:

private ActionResult ReturnJson(String msg)
{
    Response.StatusCode = (Int32)HttpStatusCode.BadRequest;
    return Content(msg, MediaTypeNames.Text.Plain);
}
public ActionResult Delete(Int32 id)
{
    string success = "ok";
    try
    {
        //code to delete         
    }
    catch (Exception ex)
    {
        return ReturnJson(ex.Message);
    }
    return Json(success);
}