Could you please provide a sample code for validate date I mean if user entered wrong date format it simply show an error...
currently I have used code....
$("#signDate").igDatePicker({ width: "180px", dataMode: "date", datepickerOptions: { changeYear: true, changMonth: true, minDate: new Date(1900, 01, 01), maxDate: new Date(2100, 01, 01), }, placeHolder: "Signed Date" });
and i want to full validation may be solved by 2 ways...
1. user not able to enter manually...
2. proper validation of wrong datetype
Thanks
Pankaj
Hello Pankaj,
Thank you for posting in our community!
The following are the available inbuilt options to use for validation with igDateEditor:
In case you want to restrict the user for doing particular keyboard input, consider using includeKeys option to filter the desired input. “Gets ability to enter only specific characters in input-field from keyboard and on paste.”
To completely restrict user input, you can use disabled option “Gets/Sets the disabled attribute for the input. If set to true the input is disabled, and all buttons and interactions are disabled. On submitting the form the editor belongs to, the value is not submitted.” In case you want to have errors being shown, you can consider using the igValidator, respectively the igDateEditor validatorOptions “Note: Validation rules of igValidator, such as min and max value/length are applied separately triggering errors, while the corresponding options of the editor prevent values violating the defined rules from being entered.” You will find more details how to use the igValidator at:
https://www.igniteui.com/help/igvalidator-overview https://www.igniteui.com/help/igvalidator-validation-rules Additional Related options:revertIfNotValid “Gets/Sets if the editor should revert it's value to the previously valid value in case the value on blur, or enter key is not valid. If the option is set to false, editor calls clear functionality.”
I expect the above API will be sufficient for you to implement your requirements.
Hello vaylo,
Thanks for your response information you have provide help me a lot but i have done this already. Actually minDate & maxDate() provide inbuilt validation message and when i have maxDate() then it is also show alert... I have found correct solution that i want using jquery datepicker change event in igdateeditor.. below is the code may be helpful for someone else...
$("#IncidentDate").igDatePicker({ dataMode: "date", dateInputFormat: "MM/dd/yyyy", dateDisplayFormat: "MM/dd/yyyy", width: "300px", required: true, placeHolder: "MM/DD/YYYY", datepickerOptions: { changeYear: true, changeMonth: true, maxDate: new Date() }, validatorOptions: { onblur: true, onchange: false, onsubmit: true, formSubmit: true, keepFocus: "always", showIcon: true } }).on("change", function (e) { var curDate = $(this).datepicker("getDate"); var maxDate = new Date(); maxDate.setDate(maxDate.getDate()); // add day if you want maxDate.setHours(0, 0, 0, 0); // clear time portion for correct results console.log(this.value, curDate, maxDate); if (curDate > maxDate) { alert("Invalid date exceed to maximum date."); $(this).igDatePicker("value", maxDate); } });