Validation numeric text box

[Tomasz Tomczykiewicz]

Hi,

I have two columns: start and end. Both are numeric and I can edit them in cell mode. If in the start cell I have value 10 I want to disable values smaller than 10 in end cell. How can I achieve this?

Best regards,

Tomasz Tomczykiewicz

[Pooja Priya Krishna Moorthy]

Hi Tomasz, 

We can achieve your requirement, by using edit.params in Gantt column property to handle numericTextBox model . When click on the end cell, using focus event of NumericTextBox we are validate and set the min value of start cell value. Hence, we can’t change less than start value. 

Please find the below code example. 

 

 

<ejs-gantt 

   //... 

   :columns= "columns" 

></ejs-gantt> 

  data: function() { 

    return { 

      //... 

      columns: [ 

        //... 

         { field: 'Custom2',width: 100, 

          edit: { 

              params: { value: 0, 

                focus: function(args){ 

                  var ganttobj = document.getElementById('GanttContainer').ej2_instances[0]; 

                  var index = ganttobj.selectedRowIndex; 

                  if(ganttobj.flatData[index].Custom1){ 

                      this.min = ganttobj.flatData[index].Custom1 

                  }           

                } 

              } 

           }, editType: 'numericedit' },        

      ], 

    }; 

  } 

 

Please find the below sample link. 

Sample - https://codesandbox.io/s/vue-template-9dp8t 

 

Regards, 

Pooja Priya K. 

[Tomasz Tomczykiewicz]

Hi,

Thanks, it's solved my problem.

Best regards,

Tomasz Tomczykiewicz

[Jonesherine Stephen]

Hi Tomasz, 

Thanks for your update. 

We are happy that issue has been resolved at your end. 

Please let us know if you need further assistance on this. 

 

Regards, 

Jone sherine P S 

[Tomasz Tomczykiewicz]

Hi,

I have an issue with this validation. In start cell I have value 10. I inline edit the end cell value to 5 and press enter, the validation doesn't work. But when I click outside the cell, the validation works.

Best regards,

Tomasz Tomczykiewicz

[Tomasz Tomczykiewicz]

Additionally, when I leave empty value after editing I have NaN (instead of null).

[Pooja Priya Krishna Moorthy]

Hi Tomasz, 

Please find the below response. 

S.No	Query	Syncfusion Comments
1	I have an issue with this validation. In start cell I have value 10. I inline edit the end cell value to 5 and press enter, the validation doesn't work. But when I click outside the cell, the validation works.	We can resolve this by setting the value of start cell to validation.min value in the focus event of NumericTextBox control as like below code example.      return {         //...         columns: [           //...         {              field: 'Custom2', width: 100,              validationRules: { required: true, number: true },              edit: {                  params: {                  focus: function (args) {                          var ganttobj = document.getElementById('GanttContainer').ej2_instances[0];                          var index = ganttobj.selectedRowIndex;                          var minValue = ganttobj.flatData[index].Custom1;                         ganttobj.ganttColumns[2].validationRules.min = minValue;                      }                  }              }, editType: 'numericedit'          },           ],   };
2	when I leave empty value after editing I have NaN (instead of null).	We suggest you to use validation required set to true. So that it prevents you from saving empty value.           return {         //...         columns: [           //...           {              field: 'Custom1', validationRules: { required: true, number: true },                 },        ],       };

 

Sample - https://codesandbox.io/s/vue-template-4rxti 

Please get back to us if you require further assistance on this. 

 

Regards, 

Pooja K. 

 

 

[Tomasz Tomczykiewicz]

Hi,

Thanks for replay, it solved my first problem. But for the second problem, we misunderstood each other. User can leave empty value- I don't want to block this option. Only problem is, when the user leaves empty value it is NaN.

https://codesandbox.io/s/vue-template-658u0

Best regards,

Tomasz Tomczykiewicz

[Pooja Priya Krishna Moorthy]

Hi Tomasz, 

We can resolve this by setting the type of column as number in the column definition. Please find the below code example. 

  

    return {  

      //...  

      columns: [  

        //...  

        { 

            field: 'Custom1', type:”number”},        

        }, 

      ],  

    };  

Sample – https://codesandbox.io/s/vue-template-hzt2h 

Regards, 

Pooja Priya K. 

 

[Tomasz Tomczykiewicz]

Hi,

Your provided solution doesn't resolve my problem. I can't delete a value, it returns to the previous value (see attached gif).

Best regards,

Tomasz Tomczykiewicz

Attachment: Kapture_20191216_at_10.21.02.gif_c94b3c45.zip

[Pooja Priya Krishna Moorthy]

Hi Tomasz, 

We are also able to reproduce the issue, when allowUnscheduledTasks property is disabled. We logged a bug report for this. You can track its status from below feedback link. 

Feedback – https://www.syncfusion.com/feedback/10814/issue-on-saving-empty-value-in-numeric-edit-type-cell 

We will fix this issue and include in our weekly patch release which is expected to be rolled out on January 2, 2020. 

Until then we appreciate your patience. 

Thanks, 

Pooja K 

[Pooja Priya Krishna Moorthy]

Hi Tomasz, 

Thanks for your patience. 

We have fixed the reported issue. Please find the release notes from below link. 

https://ej2.syncfusion.com/vue/documentation/release-notes/17.4.40/#gantt 

Please upgrade your Gantt packages to the highest version v17.4.40. We have prepared a sample with latest source, please find the sample from below link. 

https://codesandbox.io/s/vue-template-60fko 

Regards, 

Pooja K. 

[Tomasz Tomczykiewicz]

Hi,

Thanks, it's solved my problem.

Best regards,

Tomasz Tomczykiewicz

[Karthikeyan Raja]

Hi Tomasz, 

  

Most welcome. We are happy that your issue has been resolved. Please get back to us if you need any assistance on this. 

  

Regards, 

Karthikeyan Raja.