编辑器 1.6

我非常高兴地宣布发布编辑器 1.6，这是编辑器 1.x 系列中的第六个重大更新。对于所有现有许可证持有人来说，这是一次免费升级，并添加了许多激动人心的新功能，这些功能极大地提升了编辑器的功能，特别是在客户端上。

在这篇文章中，我将重点介绍 1.6 中的新功能，并在未来的文章中探讨如何利用它们来进一步增强使用编辑器开发的应用程序。

升级

编辑器 1.6 可以从其 下载页面 以免费试用版下载，供尚未尝试编辑器的人使用，如果您有许可证，则将自动下载完整授权版本。

此次发布没有特殊注意事项，它与 1.5 完全向后兼容，只需将其放入并替换您现有的库即可。如果您要从 1.4 或更早版本升级，则值得阅读 1.5 升级文档，因为该版本有一些您应该了解的更改。

客户端

编辑器主要是一个客户端软件（带有支持 PHP 和 .NET 库，以使入门更容易！），所以让我们首先关注客户端，并详细介绍在为您的客户端创建可编辑表格时可以利用的新功能。

模板

编辑器的最请求功能之一是能够以比简单线性列表更复杂的布局显示表单。以前，您可以使用 CSS 实现多列布局，但它本身存在局限性。为了解决这个问题，编辑器 1.6 引入了新的 template 选项。它允许您指向编辑器将在其主编辑表单中显示的元素，并通过 HTML5 自定义标记 (<editor-field>) 指定您希望在表单中显示每个字段的位置。

这里的想法是允许您指定您自己的 HTML 结构，无论是什么，用于表单布局。和往常一样，一个例子胜过千言万语，所以 这里有一个可用的例子。

此模板是一个相对简单的示例。可以实现更复杂的布局，包括使用选项卡来分隔字段。这将在未来的博客文章中进一步探讨。

无 Ajax

虽然大多数编辑器应用程序会向服务器发送 Ajax 请求来更新数据库，但通常还可以只是想更新 DataTables 的数据，而无需立即将其保存到服务器中。你可以在一个批处理中提交多个对你的编辑内容，或写入到本地数据库中。 auparavant，在编辑器中这意味着使用 ajax 选项并提供你自己的编辑器 客户端/服务器数据 的实现 - 这不是一项特别简单的工作！

现在，只在客户端编辑表中的数据是一件非常简单的事情 - 只需不包含 ajax 选项（以前是必需的 - 现在不再需要）。编辑器会自动为你更新表。

现在，客户端的可编辑表格可能很简单，只需定义字段，并使用按钮来触发编辑方式

$(document).ready( function () {
  var editor = new $.fn.dataTable.Editor( {
    table: '#example',
    idSrc: 0,
    fields: [
      { label: 'Name',       name: 0 },
      { label: 'Position',   name: 1 },
      { label: 'Office',     name: 2 },
      { label: 'Age',        name: 3 },
      { label: 'Start date', name: 4, type: 'datetime' },
      { label: 'Salary',     name: 5 }
    ]
  } );

  var table = $('#example').DataTable( {
    dom: "Bfrtip",
    select: true,
    buttons: [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor }
    ]
  } );
} );

语义 UI

编辑器长期以来一直与 Bootstrap、Foundation 和 jQuery UI 有直接的集成，现在 语义 UI 也加入了这一行列！语义 UI 是一个现代 CSS 框架，顾名思义，它专注于通过 CSS/类名称语义提供功能和样式。在编辑器示例中有一个语义 UI 与编辑器的示例 ，可用于编辑器示例。

DataTables 下载构建器 尚未将语义 UI 作为一种样式选项纳入其中，但将在未来几天内对其进行更新。

服务器端

当我们考虑用于编辑器的 PHP 和 .NET 服务器端库时，乐趣并不会停止，每个库都会看到许多新功能。这两个库都是并行开发的，保持它们的功能集和基本 API 相同，同时根据需要允许根据每个平台的惯例进行分歧。因此，如果你在一个库中看到某个特性，那很有可能在另一个库中也可以看到。

Debug 模式

编辑器使用数据库抽象层，以便可以与各种不同的数据库通信。这个抽象层将根据实例的配置方式以及设置给它的数据来构建合适的 SQL 语句。当事情出错之前，这样做很好用。了解运行的是什么 SQL 是使用编辑器进行大多数调试的基本起点，但查看确切使用的是什么语句是非常困难的。现在，这些库有了调试模式。

Editor::inst( $db, 'myTable' )
    ->debug( true )
    ->fields( ... )
    ...;

new Editor( db, "myTable" )
    .Debug( true )
    .Model( ... )
    ...;

启用调试模式后，将在服务器在每个请求（读取、创建、编辑和删除）返回给客户端的 JSON 中返回一个 debugSql 参数。它显示了运行的查询以及绑定到该查询的任何参数。例如，在简单的更新中，我们可能会得到编辑器运行的以下 UPDATE 和 SELECT 语句

{
    "debugSql": [{
        "query": "UPDATE  `datatables_demo` SET  `first_name` = :first_name, `last_name` = :last_name, `position` = :position, `office` = :office WHERE `id` = :where_0 ",
        "bindings": [{
            "name": ":first_name",
            "value": "Fiona",
            "type": null
        }, {
            "name": ":last_name",
            "value": "Green",
            "type": null
        }, {
            "name": ":position",
            "value": "Chief Executive Officer (CEO)",
            "type": null
        }, {
            "name": ":office",
            "value": "San Francisco",
            "type": null
        }]
    }, {
        "query": "SELECT  `id` as 'id', `first_name` as 'first_name', `last_name` as 'last_name', `position` as 'position', `email` as 'email', `office` as 'office' FROM  `datatables_demo` WHERE `id` = :where_0 ",
        "bindings": [{
            "name": ":where_0",
            "value": "29",
            "type": null
        }]
    }]
}

改进的选项

在使用 已加入表中的信息时，通常希望获取最终用户可以选择选项的列表。编辑器通过其 Field->option() / Field.Option() 方法提供此功能。以前，此方法只需接受一个参数列表，而这并不是特别可扩展的。现在，它接受一个新的 Options 类的一个实例，可以用与其他编辑器类相同的类型链接 API 进行配置，使其更容易使用。

此外，新的 Options 类提供了选项来控制记录的排序和限制结果的数量，以及提供现有条件运算符和呈现器。

Field::inst( 'users.site' )
    ->options( Options::inst()
        ->table( 'sites' )
        ->value( 'id' )
        ->label( 'name' )
    );

new Field("users.site")
    .Options(new Options()
        .Table("sites")
        .Value("id")
        .Label("name")
    );

这个新类还为在不需要使接口复杂的情况下，在编辑器的未来版本中添加新功能（如自动依赖字段）提供了范围！有关更多信息，请参阅每个平台的文档：PHP | .NET。

可取消事件

特定操作执行时，库（PHP | .NET）触发的服务器端事件允许用户针对该特定操作自定义 Editor 配置，记录或更新的其他通知服务。

触发的 pre* 事件对于添加或执行验证尤为有用，但在那个时候从函数取消 Editor 将执行的操作没有办法（例如，如果自定义验证失败）。1.6 版中现在提供了这项功能，可在其中取消触发的所有 pre* 事件。

在以下示例中，在将某个表写入数据库之前，对会话变量进行了检查以确认用户具有更新该表的权限。如果没有权限，则取消操作。

$editor->on( 'preEdit', function ( $editor, $id, $values ) {
    if ( ! $_SESSION['access-edit'] ) {
        return false;
    }
} );

editor.PreEdit += ((sender, args) =>
{
    if (!Session["AccessEdit"])
    {
        args.Cancel = true;
    }
});

详情了解服务器端事件，请查看每个库的文档：PHP | .NET。

复合键

为了编辑和删除 DataTable 中的数据，Editor 需要唯一处理每一行。这是通过 唯一键实现的。以前只能使用数据库表中单个列的值，但在版本 1.6 中，可以使用 复合键（即由多个列组成的键）。在处理想要保证唯一的表，以及日期和其他场景时，这可能特别有用。

PHP 和 .NET 库中通过仅传递组成复合键的列名的数组（创建新 Editor 实例使用为主密钥参数）来实现对它的支持

Editor::inst( $db, 'visitors', array('visitor_id', 'visit_date') );

new Editor( db, "visitors", new []{"visitor_id", "visit_date"} );

使用复合键时需要注意一个重要考虑因素：创建新行时必须提交组成复合键的列的数据（否则将会显示错误）。目前 Editor 无法读取由数据库生成的信息。如果需要设置服务端计算的值（例如当前时间），请使用 Field->setValue() / Field.SetValue() 方法来设置值。

完整版本说明

当然，在 Editor 1.6 中还有许多其他较小的全新功能和一些 bug 修复，例如

• fields.multiEditable用来表示编辑多行时，字段不可编辑
• Bootstrap 4 技术预览示例（在编写时，Bootstrap 4 仍然处于 alpha 版）。
• 服务器端库中的全局验证 - PHP | .NET
• PHP 和 .NET 库中的 Oracle 支持

有关 1.6 中新增功能、更改和修复的全部信息和详细信息，请参阅 1.6.0 版本说明。