Kendo MVC Razor validation not firing correctly on the client side for numeric textbox

[Jacques]

Hi, 

I'm using the numeric text box as follows: 

<div class="col-md-7 col-sm-6">
    @(Html.Kendo().NumericTextBoxFor(m => m.MaintenanceYearlyAmount).Decimals(1).Deferred(true))
    @Html.ValidationMessageFor(m => m.MaintenanceYearlyAmount)
</div>

The model property 'MaintenanceYearlyAmount' has the following attributes for validation: 

[Display(Name = "Annual Maintenance")]
[Required]
[Range(0,1000)]
[ToolTip("Dependant's Annual Maintenance")]
public decimal? MaintenanceYearlyAmount
{
    get
    {
        return ModelEntity.MaintenanceYearlyAmount;
    }
    set
    {
        ModelEntity.MaintenanceYearlyAmount = value;
    }
}

When testing this I get the following results: 

• I enter 999.56 - It rounds up to 999.60 (Why is it showing the additional zero at the end when I've specified only 1 decimal?)
• I enter 1111 and tab off the control - I get a valid validation message of 'Please enter a value less than or equal to 1000' AND it automatically changes the value to 1000 (is there a way to stop this from happening? The user should be warned, but it's there responsibility to change the value not to have it automatically changed. They might have entered 9845 accidentally adding the 5 at the end and instead of just deleting the 5 they have to type the number out again. 
• I remove the Range validation and keep only the Required validation.  
  
  • I delete the current value for MaintenanceYearlyAmount and for Full Name (which is a normal Microsoft textbox and is required in the model) and click save. - Full name correctly shows its validation message, but the Kendo numeric textbox doesn't. This is where the problem is. I'm not sure why the client side validation doesn't fire correctly or show the validation message. If I add the Full name value back and click submit/save again, Full name passes, the form submits and server side validation fails sending the form back with the correct message under the MaintenanceYearlyAmount input. So bottom line is that the validation works server side, but not client side for the Required Validator. 

[Georgi Krustev]

Hello Jacques,

Straight up to your questions:

1) Why is it showing the additional zero... ?

The widget formats the value with 2 decimal digits, as the default format is "n2". If you would like to persist the precision up to one digit then set the format of the widget to "n1":

@(Html.Kendo().NumericTextBoxFor(m => m.MaintenanceYearlyAmount)
  .Decimals(1)
  .Format("n1")
  .Deferred(true)
)

2) Why value is reverted to "1000" (paraphrased)? 

The widget is designed to fit the input value to the defined min/max range. If you would like to avoid this behavior, then you will need to disable the defined range:

@(Html.Kendo().NumericTextBoxFor(m => m.MaintenanceYearlyAmount)
  .Decimals(1)
  .Format("n1")
  .Deferred(true)
  .Min(null)
  .Max(null)
)

The other option is to remove the Range data annotation attribute.

3) The required validation message is not shown on post (paraphrased) ?

I suppose that the problem is related with the default jQuery Validate behavior to not validate hidden elements. I would suggest you check the following help topic. Let me know if this does not solve the problem.

Regards,
Georgi Krustev
Telerik