如何在 IgGrid 细胞(Infragistics)中获得正则表达式?
How to get Regular Expression in IgGrid cell (Infragistics)?
如何在 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"
}]
}]
});
我想在时间列中实现一个时间选择器,但它不存在,所以我尝试通过正则表达式在文本编辑器中只获取时间。
网格加载了名为 Time, Mo- Friday 的列。
如果你点击添加到网格,你可以点击输入字段并填写你的时间。在单击完成并显示错误消息之前应该验证时间。
查看 table 的样子:https://codepen.io/ablablabla/pen/PJLbJz
缺乏验证是因为 validatorOptions
belong to the editorOptions
(因为这些会传递给您选择作为提供者的任何编辑器)。 validation: true
只获得一些默认值,除了必需的之外,这对文本字段真的没有太大作用。
然后 RegExp 选项(据我所知,它用于上面代码片段中的电子邮件)自 15.2 以来一直是 pattern
:) 所以在那个时间栏的最后你可以尝试:
//...
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
},
},
//..
根据您的目标,您还可以使用 Mask Editor or a Date Editor as provider. Also the obligatory docs link: https://www.igniteui.com/help/iggrid-updating
P.S。绑定到一个空数组以避免第一行没有值且更重要的是主键的错误。
如何在 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"
}]
}]
});
我想在时间列中实现一个时间选择器,但它不存在,所以我尝试通过正则表达式在文本编辑器中只获取时间。 网格加载了名为 Time, Mo- Friday 的列。 如果你点击添加到网格,你可以点击输入字段并填写你的时间。在单击完成并显示错误消息之前应该验证时间。
查看 table 的样子:https://codepen.io/ablablabla/pen/PJLbJz
缺乏验证是因为 validatorOptions
belong to the editorOptions
(因为这些会传递给您选择作为提供者的任何编辑器)。 validation: true
只获得一些默认值,除了必需的之外,这对文本字段真的没有太大作用。
然后 RegExp 选项(据我所知,它用于上面代码片段中的电子邮件)自 15.2 以来一直是 pattern
:) 所以在那个时间栏的最后你可以尝试:
//...
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
},
},
//..
根据您的目标,您还可以使用 Mask Editor or a Date Editor as provider. Also the obligatory docs link: https://www.igniteui.com/help/iggrid-updating
P.S。绑定到一个空数组以避免第一行没有值且更重要的是主键的错误。