使用Web服务的jQuery DataTable内联编辑

时间:2019-02-24 02:13:51

标签: web-services datatables asp.net-ajax

我正在尝试使用.Net中的Web服务来编辑jQuery DataTable。我可以将数据加载到表中,并显示“编辑/删除/新”按钮,但似乎无法通过将参数传递给UpdateTable WebMethod来弄清楚如何编辑表。我发现的唯一文档是使用PHP。这是我所拥有的:

var editor; // use a global for the submit and return data rendering in the examples

$(document).ready(function () {
editor = new $.fn.dataTable.Editor({
    ajax: "../WebService1.asmx/UpdateTable",
    table: "#example",
    fields: [{
        label: "First name:",
        name: "FirstName"
    }, {
        label: "Last name:",
        name: "LastName"
    }
    ]
});
});
// Activate an inline edit on click of a table cell
$('#example').on('click', 'tbody td:not(:first-child)', function (e) {
editor.inline(this);
});

$.ajax({
url: '../WebService1.asmx/GetTable',
method: 'post',
dataType: 'json',
success: function (data) {
    $('#example').dataTable({

        dom: "Bfrtip",
        paging: true,
        sort: true,
        searching: true,
        scrollY: 200,
        data: data,
        columns: [
            {
                defaultContent: '',
                className: 'select-checkbox',
                orderable: false
            },
            { data: "FirstName" },
            { data: "LastName" }
        ]
        ,
        select: {
            style: 'os',
            selector: 'td:first-child'
        },
        buttons: [
            { extend: "create", editor: editor },
            { extend: "edit", editor: editor },
            { extend: "remove", editor: editor }
        ]
    });
}
});

0 个答案:

没有答案