问题
how can i have a regular expression on a igTextEditor in igGrid Updating?
i tried to use validate option but it didn't worked.
$("#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"
}]
}]
});
i want to achive a time picker in the Time Column but that doesn't exist so i try to get only time in the textEditor by regular expression. the grid gets loaded with columns named Time, Mo- Friday. if you click on add in grid you can click in the input field and fill your time. the time should get validated before clicking on done and show a error message.
to see how the table look like: https://codepen.io/ablablabla/pen/PJLbJz
回答1:
The lack of validation is because the validatorOptions belong to the editorOptions (as those get passed down to whatever editor you choose as provider). The validation: true
only gets some defaults, which really won't do much for a text field besides the required.
And then the RegExp option (which is for an email in the snippet above as far as I can tell) has been pattern since 15.2 :) So in the end for that time column you can try:
//...
editorOptions: {
validatorOptions: {
pattern: /^\d{1,2}\:\d{2}$/,
onblur: true,
onchange: true
},
},
//..
Here's an updated codepen: https://codepen.io/anon/pen/YrgYxj
Edit: Or if you want to set the error message:
//...
editorOptions: {
validatorOptions: {
pattern: {
expression: /^\d{1,2}\:\d{2}$/,
errorMessage: "Time should match a pattern like 00:00"
},
onblur: true,
onchange: true
},
},
//..
Depending on your goals you could also use a Mask Editor or a Date Editor as provider. Also the obligatory docs link: https://www.igniteui.com/help/iggrid-updating
P.S. Bind to an empty array to avoid the error for that first row that has no values and more importantly primary key.
来源:https://stackoverflow.com/questions/46832828/how-to-get-regular-expression-in-iggrid-cell-infragistics