如何在IgGrid单元格中获取正则表达式（碎片）？

提问者：小点点

如何在IgGrid单元格中获取正则表达式（碎片）？

如何在 igGrid 更新中的 igTextEditor 上使用正则表达式？

我试图使用验证选项，但它不起作用。

   $("#schedulerTable").igGrid({
            columns: $scope.schedulerColumns,
            width: "87%",
            height: "300px",
            fixedHeaders: true,
            autoGenerateColumns: false,
            autofitLastColumn: true,
            autoCommit: true,
            renderCheckboxes: true,
            responseDataKey: "results",
            dataSource: $scope.schedulerData,
            updateUrl: "",
            primaryKey: 'Id',
            features: [
            {
                name: "Updating",
                generatePrimaryKeyValue: function (evt, ui) {
                    nextPrimarykey -= 1;
                    ui.value = nextPrimarykey;
                },
                enableAddRow: true,
                enableDeleteRow: true,
                editMode: "row",
                columnSettings: [
                   {
                       columnKey: "Id",
                       editorType: "numeric",
                       editorOptions: {
                           readOnly: true
                       }
                   }, {
                       columnKey: "Time",
                       editorType: "text",

                       editorOptions: {
                       },
                       validatorOptions: {
                           regExp: /^[a-zA-Z]{1}[a-zA-Z0-9_\.\-]*\@\w{2,10}\.\w{1,10}$/,
                           onblur: true,
                           onchange: true
                       },

                       required: true,
                       validation: true,
                       defaultValue: "00:00"
                   },
                   {
                       columnKey: "Mo"

                   },
                   {
                       columnKey: "Tu"

                   },
                    {
                        columnKey: "We"

                    },
                    {
                        columnKey: "Th"

                    },
                    {
                        columnKey: "Fi"

                    }]
            }]
        });

我想在时间列中实现一个时间选择器，但它不存在，所以我尝试通过正则表达式在textEditor中只获取时间。网格中加载了名为Time，Mo-Friday的列。如果您单击插件网格，您可以在输入字段中单击并填写您的时间。在单击done并显示错误消息之前，应该验证时间。

要查看表的外观： https://codepen.io/ablablabla/pen/PJLbJz

共1个答案

匿名用户

缺少验证是因为validatorOptions属于editorOptions（因为这些选项会传递给您选择作为提供程序的任何编辑器）。＜code＞validation:true＜/code＞只获得一些默认值，这对于文本字段来说，除了所需的之外，真的没有什么作用。

从15.2开始，RegExp选项(据我所知，它是针对上面代码片段中的电子邮件的)一直是< code>pattern:因此，在time列的末尾，您可以尝试:

//...
    editorOptions: {
     validatorOptions: {
       pattern: /^\d{1,2}\:\d{2}$/,
       onblur: true,
       onchange: true
     },
    },
//..

以下是更新的代码笔：https://codepen.io/anon/pen/YrgYxj

编辑：或者，如果要设置错误消息：

//...
    editorOptions: {
     validatorOptions: {
       pattern: {
        expression: /^\d{1,2}\:\d{2}$/,
        errorMessage: "Time should match a pattern like 00:00"
       },
       onblur: true,
       onchange: true
     },
    },
//..

根据你的目标，你也可以使用一个掩码编辑器或者一个日期编辑器作为提供者。也是必不可少的文件链接:https://www.igniteui.com/help/iggrid-updating

P.S .绑定到一个空数组，以避免第一行没有值和更重要的主键的错误。