当前位置: 首页 > 知识库问答 >
问题:

Datatables-无法使编辑器工作

潘飞英
2023-03-14

我使用的数据表版本如下:

      <script src="https://cdn.datatables.net/r/bs-3.3.5/jqc-1.11.3,dt-1.10.8/datatables.min.js"></script>

以及以下版本的编辑器、按钮和选择:

    <script type="text/javascript" src="/jquery/Editor-PHP-1.5.5/js/dataTables.editor.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.1.2/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/select/1.1.2/js/dataTables.select.min.js"></script>

这是我的js文件,它调用我的API并读取数据和编辑器:

var编辑器;//在示例中使用全局提交和返回数据渲染

$(document).ready(function() {
editor = new $.fn.dataTable.Editor( {
    ajax: {
        create: {
            type: 'POST',
            url:  '../php/rest/create.php'
        },
        edit: {
            type: 'PUT',
            url:  '../php/rest/edit.php?id=_id_'
        },
        remove: {
            type: 'DELETE',
            url:  '../php/rest/remove.php?id=_id_'
        }
    },
    table: "#list_blogs_table",
    fields: [ {
                        label:         'entry_id',
                        name:           'entry_id'
                        },

                                          {
                        label:         'entry_name',
                        name:           'entry_name'
                        },
                                              {
                        label:         'entry_body',
                        name:           'entry_body'
                        },
                                              {
                        label:         'entry_date',
                        name:           'entry_date'
                        },
                                              {
                        label:         'status',
                        name:           'status'
                        },
                                              {
                        label:         'created_timestamp',
                        name:           'created_timestamp'
                        },
                                              {
                        label:         'updated_timestamp',
                        name:           'updated_timestamp'
                        },
    ]
} );

$('#list_blogs_table').DataTable( {
    dom: "Bfrtip",
    url: "http://www.example.com/api/v1/blog/blogs/format/json",
    dataSrc: "message",
    columns: [
        { data: "entry_id" },
        { data: "entry_name" },
        { data: "entry_body" },
        { data: "entry_date" },
        { data: "status" },
        { data: "created_timestamp" },  
        { data: "updated_timestamp" },
    ],
    select: true,
    buttons: [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor }
    ]
} );

} );

这是我的HTML:

    <table id="list_blogs_table" class="table table-hover table-striped table-bordered">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Title</th>
                            <th>Article Text</th>
                            <th>entry_date</th>
                            <th>Status</th>
                            <th>Created</th>
                            <th>Updated</th>

                        </tr>
                    </thead>
                    <tfoot>
                            <th>Id</th>
                            <th>Title</th>
                            <th>Article Text</th>
                            <th>entry_date</th>
                            <th>Status</th>
                            <th>Created</th>
                            <th>Updated</th>
                    </tfoot>
                    <tbody>
                    </tbody>
                </table>  

这是我的JSON文件(已缩短)

  {
"status": "success",
"message": [{
    "entry_id": "1",
    "entry_name": "12345678",
    "entry_body": "this is just the beginning update",
    "entry_date": "2016-05-02 20:13:12",
    "status": "active",
    "created_timestamp": "2016-05-01 21:25:51",
    "updated_timestamp": "2016-05-01 21:25:51"
}, {
    "entry_id": "2",
    "entry_name": "one one one",
    "entry_body": "this is just the beginning update 1",
    "entry_date": "2016-05-02 20:13:16",
    "status": "active",
    "created_timestamp": "2016-05-02 14:44:03",
    "updated_timestamp": "2016-05-01 21:25:51"
},
  [snip]

共有1个答案

长孙章横
2023-03-14

我找到了解决办法。这是修改后的代码。愚蠢地看东西。

      $('#list_blogs_table').DataTable( {
    dom: "Bfrtip",

    "ajax": {
        "url": "http://www.example.com/api/v1/blog/blogs/format/json",
        "dataSrc": "message",
    },

    columns: [
        { data: "entry_id" },
        { data: "entry_name" },
        { data: "entry_body" },
        { data: "entry_date" },
        { data: "status" },
        { data: "created_timestamp" },  
        { data: "updated_timestamp" },
    ],
    select: true,
    buttons: [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor }
    ]
} );
 类似资料:
  • 当我双击可以编辑的单元格时,网格的Vaadin 8编辑器无法正常工作。 我使用简单的代码来创建网格并添加一个列编辑器组件。 接下来,我运行应用程序并开始滚动网格,直到列“计划状态”。 那么。我该怎么做,或者如何修复它以在网格中正确打开编辑器?

  • 我使用DataTables编辑器插件(https://editor.datatables.net/)用于编辑包含远程数据的表(https://datatables.net/examples/data_sources/server_side.html)在内联模式下(https://editor.datatables.net/examples/inline-editing/simple.html) 在

  • 我使用的数据表库由文森特·班比科和优素福·奥兹德米尔编写https://github.com/IgnitedDatatables/Ignited-Datatables 我已经查看了这里提供的支持信息http://codeigniter.com/forums/viewthread/160896/ 我遇到了编辑列功能的问题。 我得到的不是输出到json字符串的数据,而是作为第三个参数输入的文本,例如“

  • vscode调试一个程序,但是程序运行完后,却无法结束.终端可以正常使用.这个调试控制板无法关闭,如果再发起一次调试,就会如下所示 这是为什么,如何解决

  • 在应用程序上运行jest失败,原因是: 应用程序已经安装了和的软件包。 巴别塔配置:

  • 请注意,这是一个自我回答的问题。 这个问题是关于ToastUI图像编辑器v3.3.0的,但它也可能适用于较新版本。 当您使用此官方示例加载图像时: 编辑器不会加载图像。该函数既不抛出,也不返回任何指示失败的内容,您不会收到任何错误消息。它返回一个按照留档中指定的解析的promise。 它仅通过在初始配置中指定图像来加载图像,之后无法更改: 似乎loadImageFromURL函数已损坏,根据其他用