For a project I’m working on now I wanted a numeric editor, something that would only allow input of digits. I found a jQuery numeric plugin that does the job. I also created a custom EditorTemplate for both decimal and int data types. For the int EditorTemplateyou have to name the file ‘Int32.cshtml’.
@model System.Int32?
@Html.TextBox("",
(Model.HasValue) ? ViewData.TemplateInfo.FormattedModelValue : "",
new { data_integer = true, @style = "width:90px;" })
The decimal template has the same code except the ‘data-’ attribute is data_decimal. Then in $(document).ready(function () {} I included the following code taken from the plugin template example, modified to utilize the ‘data-’ attribs that I generated in the templates.
$(":input[data-decimal]").numeric();
$(":input[data-integer]").numeric(false, function () { alert("Integers only"); this.value = ""; this.focus(); });
$(":input[data-positivedecimal]").numeric({ negative: false }, function () { alert("No negative values"); this.value = ""; this.focus(); });
$(":input[data-positiveinteger]").numeric({ decimal: false, negative: false }, function () { alert("Positive integers only"); this.value = ""; this.focus(); });
$("#remove").click(
function (e) {
e.preventDefault();
$(".numeric,.integer,.positive").removeNumeric();
}
);