Validate start and end dates

[Dmitry Vorobyev]

Hi,

We allow the users to edit StartDate and EndDate values, both via columns and add/edit dialog. We've noticed that it's possible to specify such values that EndDate would be less than StartDate and no error is shown. Is it possible to validate these values to prevent the EndDate < StartDate scenario? Any UI intervention like disabling the Save button would work.

Thanks in advance.

[Pooja Priya Krishna Moorthy]

Hi Dmitry, 

Currently, we have validation support in cell editing alone. We can achieve this using validationRules of columns property. Please find the below code example. 

constructor(props) { 

   //... 

   this.priorityRules = { 

        minDate: [this.customFn, 'End Date must be greater that start date'], required: true 

   }; 

} 

customFn(args) { 

    var obj = document.getElementById('Editing').ej2_instances[0]; 

    var enddatevalue = args.value; 

    var startDate = window.rowData.ganttProperties.startDate; 

    if (new Date(enddatevalue).getTime() >= new Date(startDate).getTime()) 

       return true; 

    return false; 

}; 

 

<GanttComponent id = 'Editing' dataSource ={ editingData} 

< ColumnsDirective > 

//... 

< ColumnDirective field = 'EndDate' validationRules ={ this.priorityRules}></ ColumnDirective > 

</ ColumnsDirective > 

/> 

</GanttComponent> 

        

Sample - https://stackblitz.com/edit/react-pzsr4u?file=index.js 

 

We have logged feature for validation in dialog. The status can be tracked from below feedback link. 

https://www.syncfusion.com/feedback/15480/provide-support-for-custom-validation-in-add-edit-dialog 

As we have already lined up some major features, we could not start its implementation immediately. Please cast your vote to make it count. We will prioritize the features for every release based on demands. 

 

Regards, 

Pooja K. 

[Yee Vone]

Hi Pooja,

Does the "validationRules" property working on ej2-react-gantt version "20.1.50"? Tried on it but got an error.

Thanks

[Premkumar Sudalaimuthu]

Hi Dmitry,

We have checked the issue from our side in version 20.1.50. It is not replicating for us and its working fine. We have shared a video for your reference. We request you to clear the browser cache and check. If still, you are facing the issue, please share the video demonstration, code snippets, and replication steps for the issue. It will be helpful for us to provide you with a better solution.

Video: https://www.syncfusion.com/downloads/support/directtrac/general/ze/validation-1472299933

Sample: https://stackblitz.com/edit/react-fbr9yi?file=package.json

Regards,

Premkumar S