0

我在 ASP.Net 中使用 jQuery 数据表编辑器。参考[此处]（https://editor.datatables.net/examples/simple/inTableControls.html）给出的示例，我按以下顺序包含了所有 JS 和 CSS：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>   
<script type="text/javascript" src="http://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://editor.datatables.net/media/js/dataTables.editor.min.js"></script>
<script src="JS/data_table_edit_delete.js" type="text/javascript"></script>

<link href="http://cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css" rel="stylesheet" />
<link href="https://editor.datatables.net/media/css/dataTables.editor.min.css" rel="stylesheet" />

但是我undefined is not a function在这一行遇到了错误：

editor = new $.fn.dataTable.Editor({

我在数据表编辑器示例中的上述链接中给出了相同的代码。只是我从 C# rater 获取数据而不是 PHP。当我搜索时，我发现它可能找不到 javascript 参考。但是我使用的所有内容都与该示例类似。

我在文件中的 js 代码data_table_edit_delete.js是：

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

$(document).ready(function () {
    // console.log($.fn.dataTable.Editor); 
   // console.log($.fn.DataTable.Editor); 

    editor = new $.fn.dataTable.Editor({
        "ajax": "data_table2.aspx/BindDatatable",
            "table": "#example",
            "fields": [{
            "label": "User ID:",
                "name": "UserId"
        }, {
            "label": "User Name:",
                "name": "UserName"
        }, {
            "label": "Location:",
                "name": "Location"
        }]
    });

    // New record
    $('a.editor_create').on('click', function (e) {
        e.preventDefault();

        editor.create({
            title: 'Create new record',
            buttons: 'Add'
        });
    });

    // Edit record
    $('#example').on('click', 'a.editor_edit', function (e) {
        e.preventDefault();

        editor.edit($(this).closest('tr'), {
            title: 'Edit record',
            buttons: 'Update'
        });
    });

    // Delete a record
    $('#example').on('click', 'a.editor_remove', function (e) {
        e.preventDefault();

        editor.remove($(this).closest('tr'), {
            title: 'Delete record',
            message: 'Are you sure you wish to remove this record?',
            buttons: 'Delete'
        });
    });

    $('#example').DataTable({
        ajax: "data_table2.aspx/BindDatatable",
        columns: [{
            data: null,
            render: function (data, type, row) {
                // Combine the first and last names into a single table field
                return data.first_name + ' ' + data.last_name;
            }
        }, {
            data: "UserId"
        }, {
            data: "UserName"
        }, {
            data: "Location"
        }, {
            data: null,
            className: "center",
            defaultContent: '<a href="" class="editor_edit">Edit</a> / <a href="" class="editor_remove">Delete</a>'
        }]
    });
});

谢谢。

4

0 回答 0