Hello,
I have the following situation:
I have a grid with two DateTime columns (startDate and endDate), when adding/editing I would like to disable the Done button if the startDate is after the endDate. Something like (pseudocode):
if (endDate >startDate) doneButton.disable()
Is this possible? What is the preferred way to check condition about several columns. I am writing all my code in C# over MVC.net.
Thanks in advance
Hello Javier,
Thank you for posting in our community.
I believe Validation is what will help you achieve your requirement. This is a way to validate your data against certain rules that meet your requirement. Validation is implemented using igValidator control in igGrid. The main purpose of this control is to inform the end user for the passed and failed validation immediately by default. This means that when user blur the editor`s input a feedback message is immediately displayed giving useful information about the state in which editor is in. When using igGrid validator options could be set by Updating behavior`s column settings.
A working sample that demonstrates validation could be found at the following link:
http://www.igniteui.com/grid/basic-editing
In this sample ID, CustomerID, Order Date and Ship Address columns have validation applied- ID is read only column, Order Date and CustomerID are set to be required and the text in Ship Address should be longer that 4 symbols. This is achieved as following:
.Features(feature => { feature.Updating().ColumnSettings(cs => { cs.ColumnSetting().ColumnKey("OrderID").ReadOnly(true); cs.ColumnSetting().ColumnKey("OrderDate").EditorType(ColumnEditorType.DatePicker).Required(true); cs.ColumnSetting().ColumnKey("CustomerID").EditorType(ColumnEditorType.Combo).Required(true).ComboEditorOptions(co => co.DataSource(ViewBag.Customers).ValueKey("ID").TextKey("CompanyName").Mode(ComboMode.DropDown).EnableClearButton(false)); cs.ColumnSetting().ColumnKey("ShipAddress").Required(true).TextEditorOptions(o => o.ValidatorOptions(vo => vo.LengthRange(4))); cs.ColumnSetting().ColumnKey("TotalItems").Required(true); cs.ColumnSetting().ColumnKey("TotalPrice").Required(true).EditorType(ColumnEditorType.Currency); }); feature.Sorting(); })
When you enter edit mode any try to violate any of the rules set by the validation an error message appears and explains what needs to be done. Unless validation rules are not met Done button is not enabled.
In your particular scenario a custom validation rule needs to be created and applied. This is achieved by the custom option of the igValidator. It gets/sets a custom function to perform validation with. For example:
//Initialize$('.selector').igValidator({ custom: function(value, fieldOptions){ return false; }}); //Getvar custom = $(".selector").igValidator("option", "custom"); //Setvar custom = { method: function (value, fieldOptions) { return false; }, errorMessage: "This field is required." }; $(".selector").igValidator("option", "custom", custom);
In your case a function that compares the two dates should be crated and applied. Also you could customize the error message to show your customers what is preventing them from adding the new row(or updating existing).
Please let me know if you need any further assistance with this matter.
Thanks for the quick response.
I have tried to create a custom validator using the jQuery API but I wasn't able to get it working.
Let me specify further my scenario.
In my cshtml I have the following:
<div id="myForm" class="form-group"> @(Html.Infragistics().Grid<myModel>() .ID("myGrid") ...
This is the grid which is contained in a bigger form where I have others grids and fields. This contains the two columns startDate and endDate.
Now, I have tried the jQuery API that you pasted. I have initialize the custom validator but it didn't work. My doubt is to which object should I initialize the validator.
I have tried all the of them and none of them worked.
Specifically, what I want is when the user opens the popup to edit a row, the done button is disabled if the condition is not met. Where should I "attach" the validator to?
Thanks in advance.