MVC and HTML5 Validation: conflict with the decimal format

Question

I've got an input element:

View

<input 
type="number" 
min="0" 
max="100" 
step="1" 
value="@Model.Percentage" 
name="Percentage" />

Model

[Required][Range(0.2,10000)][DisplayFormat(DataFormatString = "{0:n2}", ApplyFormatInEditMode = true)]
public decimal? Percentage { get; set; }

In this way the input type stays empty in the browser.

I can force it by replacing the comma with a dot in the percentage ToString.

But then the DataAnnotations don't work any more.

Also have a look to HTML5 rendered input and the default MVC rendered input:

<input 
class="text-box single-line 
input-validation-error" 
data-val="true" 
data-val-number="The field Percentage must be a number." 
data-val-range="The field Percentage must be between 0 and 100." 
data-val-range-max="100" data-val-range-min="0" 
data-val-required="The field Percentage is mandatory" 
id="Percentage" name="Percentage" type="text" value="0,0" 
aria-required="true" 
aria-invalid="true" 
aria-describedby="Percentage-error Percentage-error Percentage-error Percentage-error">

<input type="number" 
min="0" 
max="100" 
step="1" 
value="1" 
name="Percentage" 
aria-invalid="false" 
aria-describedby="Percentage-error Percentage-error" 
class="valid">

Please show your code, can't help you without it.

Harry
– Harry

2014-10-21 10:55:55 +00:00
Commented Oct 21, 2014 at 10:55 — Harry
– Harry, Commented Oct 21, 2014 at 10:55

severin · Accepted Answer · 2014-10-21 11:50:16Z

1

Use MVC html helpers instead:

@Html.TextBoxFor(m => m.Percentage)

You can add attributes to the MVC-generated markup like this:

@Html.TextBoxFor(m => m.Percentage, new { @type = "number", @step="1", @min = "0", @max = "100" })

edited Oct 21, 2014 at 11:50

answered Oct 21, 2014 at 11:08

severin

5,5539 gold badges37 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Revious Over a year ago

But in this way I will loose the nice stuffs added by HTML5? I mean the step incrementing and so on?

Revious Over a year ago

I've added the diffference between HTML5 and MVC controls

Revious Over a year ago

I've used @Html.TextBoxFor, but now I get a conflict in the validation.. The Javascript validator thinks that this symbol is wrong "," but MVC is using that symbol...

Collectives™ on Stack Overflow

MVC and HTML5 Validation: conflict with the decimal format

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related