Question

我有一个项目，我希望内联编辑通过DataTables生成的表中的值，因此使用dataTables.editable 该表渲染正常，但是当我尝试并编辑一个编辑时，我得到一个错误，如果我查看返回值，则id字段为空。控制器动作如下：

public ActionResult AjaxHandler(jQueryDataTableParamModel param)
    {
        var allMonthlyCosts = _unitOfWork.MonthlyCostRepository.Get(includeProperties: "Period, Employee");
        IEnumerable<MonthlyCost> filteredMonthlyCosts;
        if (!string.IsNullOrEmpty(param.sSearch))
        {
            filteredMonthlyCosts = _unitOfWork.MonthlyCostRepository.Get(includeProperties: "Period, Employee")
                .Where(mc => mc.Period.Name.Contains(param.sSearch)
                    ||
                    mc.Employee.ClockNo.Contains(param.sSearch));
        }
        else
        {
            filteredMonthlyCosts = allMonthlyCosts;
        }

        var displayedMonthlyCosts = filteredMonthlyCosts
            .Skip(param.iDisplayStart)
            .Take(param.iDisplayLength);

        var result = from mc in displayedMonthlyCosts
                     select new { ID = mc.Id, EvisionCost = mc.EvisionCost, EmployeeNo = mc.Employee.ClockNo, PeriodName = mc.Period.Name, TotalDays = mc.TotalDays, TotalCost = mc.TotalCost() };

        return Json(new
        {
            sEcho = param.sEcho,
            iTotalRecords = allMonthlyCosts.Count(),
            iTotalDisplayRecords = filteredMonthlyCosts.Count(),
            aaData = result
        },
        JsonRequestBehavior.AllowGet);
    }

Javascript如下：

$('#myDataTable').dataTable({
    "bServerSide": true,
    "sAjaxSource": "MonthlyCost/AjaxHandler",
    "bProcessing": true,
    "aoColumns": [
        { "mData": "ID",
            "bSearchable": false,
            "bSortable": false,
            "bVisible": false
        },
        { "mData": "EvisionCost" },
        { "mData": "PeriodName" },
        { "mData": "EmployeeNo" },
        { "mData": "TotalDays" },
        { "mData": "TotalCost" }
    ]
}).makeEditable({
    sUpdateURL: "/MonthlyCost/UpdateData",
    "aoColumns": [
        {},
        null,
        null,
        null,
        null]
});

我得到的错误是：

单元格不能#Updated（服务器错误）

返回的表格如下：

value:2505
id:
rowId:0
columnPosition:0
columnId:1
columnName:EvisionCost

Answer 1

问题非常明确您的编辑未达到以下插件代码。这就是为什么它抛出你提到的错误

编辑可编辑插件中的代码：

//Utility function used to apply editable plugin on table cells
    function fnApplyEditable(aoNodes) {
        var oDefaultEditableSettings = {
            event: 'dblclick',
            "callback": function (sValue, settings) {
                properties.fnEndProcessingMode();
                if (sNewCellValue == sValue) {
                    var aPos = oTable.fnGetPosition(this);
                    oTable.fnUpdate(sValue, aPos[0], aPos[2]);
                } else {
                    var aPos = oTable.fnGetPosition(this);
                    oTable.fnUpdate(sOldValue, aPos[0], aPos[2]);
                    properties.fnShowError(sValue, "update");
                }

            },
            "submitdata": function (value, settings) {
                properties.fnStartProcessingMode();
                sOldValue = value;
                sNewCellValue = $("input,select", $(this)).val();
                var id = fnGetCellID(this);
                var rowId = oTable.fnGetPosition(this)[0];
                var columnPosition = oTable.fnGetPosition(this)[1];
                var columnId = oTable.fnGetPosition(this)[2];
                var sColumnName = oTable.fnSettings().aoColumns[columnId].sName;
                if (sColumnName == null || sColumnName == "")
                    sColumnName = oTable.fnSettings().aoColumns[columnId].sTitle;
                return {
                    "id": id,
                    "rowId": rowId,
                    "columnPosition": columnPosition,
                    "columnId": columnId,
                    "columnName": sColumnName
                };
            },
            "onerror": function () {
                properties.fnEndProcessingMode();
                properties.fnShowError("Cell cannot be updated(Server error)", "update");
            },
            "height": properties.height
        };

我最近面临这个问题，我正在尝试

<script type="text/javascript">

    $(document).ready(function () {

        $('#myDataTable').dataTable({ "bProcessing": true,
            **"bServerSide": true,
            "sAjaxSource": 'Home/AjaxHandler',
            "sUpdateURL": '@Url.Action("UpdateData","Home")',
            "sAddURL": '@Url.Action("AddData","Home")' ,
            "sDeleteURL": '@Url.Action("DeleteData","Home")',**
            "aoColumns": [
                                    {   "sName": "ID",
                                        "bSearchable": false,
                                        "bSortable": false,
                                        "bVisible": false

                                    },

                        { "sName": "Contact_Name" },
                        { "sName": "Contact_Address" },
                        { "sName": "Lead_Source" },
                        { "sName": "Domain" }, 
                                ]

        }).makeEditable();
    });

        </script>
}

如果这项工作请告诉我。如果你发现任何其他方法，请提及它。我也像你一样找到答案

此致

MVC3 jquery.datatables.editable没有拾取不可见的id列

1 个答案: