Range validation bug

Hello

Range validation defined in MVC model generates invalid range validation in Javascript, with hr-hr locale.

In my model I have:

[Range(0.01, 12345678.9)]
public decimal UnitPrice { get; set; }

which generates a following validation rule in JavaScript
{"field":"UnitPrice","headerText":"UnitPrice","validationRules":{"required":true,"range":[0,01,123456789]},"format":"{0:N}","type":"number"}

while it should be
"range":[0.01,12345678.9]}

My NumericTextBoxFor is defined
@(Html.EJ().NumericTextBoxFor(model => model.UnitPrice)
    .MinValue(0).DecimalPlaces(2)
    .Locale(System.Threading.Thread.CurrentThread.CurrentCulture.Name)  // hr-hr in my case
    .ClientSideEvents(e => e.Change("stavke.onRecalculate"))

Thanks, Tom

3 Replies

AB Ashokkumar Balasubramanian Syncfusion Team June 22, 2018 11:59 AM UTC

Hi Tomislav Tustonic 
 
We have checked your reported problem (“Range validation not working in Numeric Textbox”) at our end. In our Numeric Textboxes component validation working based on jQuery validation, In jQuery range validation is based on number values only, not culture specific (Not compare string and number). For this scenario we have suggest you convert the corresponding culture values into number to resolve it, please check the below code block.   
 
[CSHTML] 
 
@(Html.EJ().NumericTextBoxFor(model => model.UnitPrice) 
    .DecimalPlaces(2).ValidationRules(val => val.AddRule("required",true).AddRule("range", "[0.01, 12345678.9]")) 
[Script] 
// Override the range validation method 
$.validator.methods.range = function (value, element, param) { 
      var obj = $("#UnitPrice").data("ejNumericTextbox"); 
      var Locale = obj.model.locale; 
      var val = ej.parseFloat(value, Locale); 
      return rangeValidation.call(this, val, element, param); 
  } 
 
Please let us know, if the provided information’s are helpful to resolve your requirement or not. 
 
Regards, 
Ashokkumar B. 



TT Tomislav Tustonic June 29, 2018 12:44 PM UTC

This isn't a good solution. This means that I have to remove all the range validations, which I have already defined in viewmodel, and move them to the client side Javascript. It's not a solution, it's a workaround for the bug.
It seems that I have no other choice but to do it all on the client side, but you should really create a bug report for this, and fix it.

Cheers, Tom.



AB Ashokkumar Balasubramanian Syncfusion Team July 2, 2018 12:45 PM UTC

Hi Tomislav Tustonic, 
 
This is not a bug at our end. We don’t need to change the server-side view model code into client-side JavaScript code block, just override the jQuery range validation method, by this you can resolve this problem. Please check the below code block 
 
[CSHTML] 
 
  @(Html.EJ().NumericTextBoxFor(Model => Model.UnitPrice) 
    .MinValue(0).DecimalPlaces(2) 
    .Locale("hr-HR")  // hr-hr in my case 
  ) 
  
  @Html.ValidationMessageFor(m => m.UnitPrice) 
 
[Model] 
public class NumericTextBox 
    { 
        [Required(ErrorMessage = "Pleasee enter you number")] 
 
        [Range(0.01, 12345678.9, ErrorMessage = "Enter number between 0.01 to 12345678.9")] 
        public string UnitPrice { get; set; } 
    } 
 
[Script] 
 
var rangeValidation = $.validator.methods.range; 
$.validator.methods.range = function (value, element, param) { 
        var obj = $("#UnitPrice").data("ejNumericTextbox"); 
        var Locale = obj.model.locale; 
        var val = ej.parseFloat(value, Locale); // pass the value and “hr-HR” 
        return rangeValidation.call(this, val, element, param); 
} 
 
Note: NumericTextBox binded value property should be string.   
 
For your reference, we have prepared the sample for your requirement, please find the sample in below location. 
 
Sample:  
 
 
Please let us know, if you have any concern on this. 
 
Regards, 
Ashokkumar B. 


Loader.
Up arrow icon