数据表中的可编辑与可编辑 - 有什么区别答案

【问题标题】：jeditable vs editable in datatable - what's the difference数据表中的可编辑与可编辑 - 有什么区别
【发布时间】：2012-08-09 00:08:12
【问题描述】：

我很困惑我应该将哪个插件与数据表 jquery 一起使用。我的问题是我找不到任何可以解决我所有问题的答案（我现在已经忍受了 4 个多小时）。对不起，如果这个问题已经被解决了无数次......

我有一个来自 mysql 数据库的 >10000 行的表，我想在特定列上添加一个单元格内联编辑，因此我找到了两种现有方法。

我的问题是有什么区别？哪一个需要哪些 js 脚本作为输入（我很困惑并在最后添加了所有这些脚本）... 我觉得有些已经过时，并且不再适用于最新版本。或者也许我正在混合它们，所以最后没有任何效果。

Jeditable（它在我手中不起作用。当我点击表格中的任何单元格时，什么都没有发生）

$("#example.", oTable.fnGetNodes()).editable( 'php/editable_ajax.php', {
                    "callback": function( sValue, y ) {
                        var aPos = oTable.fnGetPosition( this );
                        oTable.fnUpdate( sValue, aPos[0], aPos[1] );
                    },
                    "submitdata": function ( value, settings ) {
                        return {
                            "row_id": this.parentNode.getAttribute('id'),
                            "column": oTable.fnGetPosition( this )[2]
                        };
                    },
                    "height": "14px"
                });

可编辑（当我点击时，编辑事件有效，但数据库中的值没有更新，除非editable_ajax.php包含完整的mysql查询，但页面没有重新加载）

$('#example').dataTable().makeEditable({
                    sUpdateURL: "php/editable_ajax.php",
                    "aoColumns": [
                        null,
                        {
                            indicator: 'Saving CSS Grade...',
                            tooltip: 'Click to select CSS Grade',
                            loadtext: 'loading...',
                            type: 'select',
                            onblur: 'submit',
                            data: "{'':'Please select...', '1':'Yes','0':'No'}" 
                        }
                    ]
                });

PHP服务器端

<?php
    echo $_POST['value'].' (server updated)';
?>

最后一个问题，其中是否有一个可以更有效地处理具有大量行的数据表？（加载它已经需要 30 秒）。

【问题讨论】：

标签： jquery mysql datatable jeditable

【解决方案1】：

以下先决条件设置说明告诉我，您绝对需要 jeditable 和 dataTables 才能使 dataTables.editable 工作。 jquery-datatables-editable

    <script src="/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.DataTables.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.jeditable.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.DataTables.editable.js" type="text/javascript"></script>

通过排除过程，我们可以假设您可以将 jeditable 单独用于 dataTables。查看source of this example，可以看到只有dataTables和jEditable被使用了。

我不太确定它们之间的区别，但我相信 dataTables.editable 为可编辑和 dataTable（以及 jValidate）之间的一些常用功能提供了一个接口，以使其更易于实现。

该插件集成了JQuery DataTables、JQuery Editable、JQuery Validation等插件，实现了常用的数据管理功能。

【讨论】：