CODEWITHSUNDEEP
c#jqueryasp.net-mvcasp.net-mvc-3
Callum Linington
Callum Linington

Reputation: 14417

Custom Number Incrementing Field MVC

I've had an idea for a html field in MVC. And thats the number incrementing textbox.

How would you go about doing that?

The idea is that I have form with some information that needs to be sumbitted. A lot of the textboxes are just number fields, so I would prefer to have them incremented with two buttons, the classic one that can be seen on VS in the toolbox for WinForms. Example: HTML 5 Incrementer however its not backwards compatible with older browsers. So I would like to make my own that is.

1) Create a custom HTML Helper which writes it out e.g.

@Html.NumberIncrementorFor(x => x.FieldToBeIncremented)

2) Find JQuery equivalent?

3) Combine both of those for the perfect solution?

Any advice and direction on this would be excellent! This is also a personal, self building project as well. So I would rather create my own then use a pre-made one. Want to expand my own skills. Obviously if this was for production I wouldn't reinvent the wheel. Just this time, I do :)

Upvotes: 1

Views: 1606

Answers (1)

Kenneth
Kenneth

Reputation: 28737

The best way to handle this is to use the HTML 5 input with a type set to number.

To get this, you can annotate your model like this:

[DataType(DataType.Integer)]
public int FieldToBeIncremented{ get; set; }

This will obviously only work in browsers which implement the input type number correctly, but you can use a polyfill to attach the wanted behavior on older browsers. Here you find a polyfill that does exactly this:

https://github.com/jonstipe/number-polyfill

Upvotes: 1

Related Questions