1

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

我在此找到的所有内容都是处理此问题的网格的基本设置,但我担心我可能没有返回正确的响应,或者我的某些功能设置不正确。我已经阅读了 wiki 文档和 Trirand 论坛中的几篇帖子,但信息中的空白让我遇到了同样的问题。

只是为了清楚编辑和添加工作正常,手动刷新等也是如此。唯一的问题是从服务器返回响应并在编辑完成后重新加载网格中的数据。

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

我的后续功能:

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.");
    }

我一直在尝试我能找到的一切,但没有任何效果,而且我认为我的代码的某些部分是错误的。

任何帮助是极大的赞赏!

4

2 回答 2

2

Finally figured out the missing piece of the puzzle!! When using inline editing and the Action buttons column, the onSuccesss, onError and afterSave functions MUST be hard coded into the column model for the grid.

In my case I was using the "Actions" column in the grid to house the edit functionality with a button. This is the button with the pencil icon that enables the inline edit.

This column uses the formatter = "actions" and has its EditActionIconsColumn = true. I had to define the

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

all of this is defined in the column model for my "Actions" column only.

The jQGrid script uses only these methods when doing the inline editing through these buttons and ignores any other places where you may have set up this functionality.

That's it. No other complicated code, no manual coding of the inline save functionality. Any other code may be implemented here as well as any of the other functionality like onError or onSuccess.

于 2013-02-26T20:11:08.323 回答
0

当您处理返回 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);
}
于 2013-01-10T01:45:47.263 回答