如何只允许在mvc4razor文本框中的数字

我有3个文本框,其中值的邮政编码和手机号码和住宅号码。 我得到的解决scheme,只允许在文本框中使用jellow来自Bellow post。

我想使EditFor文本框只接受数字

但我们可以做到这一点使用数据注释,因为我使用MVC4razor?

我只是玩弄HTML5inputtypes=数字。 虽然它不支持所有的浏览器,我期望它是前进的方式处理types特定的处理(编号为前)。 使用razor很简单(ex是VB)

@Html.TextBoxFor(Function(model) model.Port, New With {.type = "number"}) 

并感谢李Richardson,C#的方式

 @Html.TextBoxFor(i => i.Port, new { @type = "number" }) 

超出问题的范围,但你可以对任何html5inputtypes做同样的处理

使用正则expression式,例如

 [RegularExpression("([1-9][0-9]*)", ErrorMessage = "Count must be a natural number")] public int Count { get; set; } 
 @Html.TextBoxFor(m => m.PositiveNumber, new { @type = "number", @class = "span4", @min = "0" }) 

在使用Razor的MVC 5中,您可以按照上面的示例在匿名对象中添加任何htmlinput属性,以便只允许正数input到input字段中。

在文本框中写这个代码onkeypress="return isNumberKey(event)"和function,这是正好在下面。

 <script type="text/javascript"> function isNumberKey(evt) { var charCode = (evt.which) ? evt.which : event.keyCode; if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) return false; return true; } </script> 

这对我工作:

 <input type="text" class="numericOnly" placeholder="Search" id="txtSearch"> 

Javacript:

 //Allow users to enter numbers only $(".numericOnly").bind('keypress', function (e) { if (e.keyCode == '9' || e.keyCode == '16') { return; } var code; if (e.keyCode) code = e.keyCode; else if (e.which) code = e.which; if (e.which == 46) return false; if (code == 8 || code == 46) return true; if (code < 48 || code > 57) return false; }); //Disable paste $(".numericOnly").bind("paste", function (e) { e.preventDefault(); }); $(".numericOnly").bind('mouseenter', function (e) { var val = $(this).val(); if (val != '0') { val = val.replace(/[^0-9]+/g, "") $(this).val(val); } }); 

请使用DataType属性,但这将除负值,所以下面的正则expression式将避免这种情况

  [DataType(DataType.PhoneNumber,ErrorMessage="Not a number")] [Display(Name = "Oxygen")] [RegularExpression( @"^\d+$")] [Required(ErrorMessage="{0} is required")] [Range(0,30,ErrorMessage="Please use values between 0 to 30")] public int Oxygen { get; set; } 

can we do this using data annotations as I am using MVC4 razor ?

不,据我了解你的问题,不显眼的validation只会显示erorrs。 最简单的方法是使用jquery插件:

蒙面input插件

在你的脚本中使用这个函数,并在文本框附近放一个跨度来显示错误信息

  $(document).ready(function () { $(".digit").keypress(function (e) { if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) { $("#errormsg").html("Digits Only").show().fadeOut("slow"); return false; } }); }); @Html.TextBoxFor(x => x.company.ContactNumber, new { @class = "digit" }) <span id="errormsg"></span> 

这是可以让你只input数字的JavaScript。

订阅onkeypress事件的文本框。

 @Html.TextBoxFor(m=>m.Phone,new { @onkeypress="OnlyNumeric(this);"}) 

这是它的JavaScript:

 <script type="text/javascript"> function OnlyNumeric(e) { if ((e.which < 48 || e.which > 57)) { if (e.which == 8 || e.which == 46 || e.which == 0) { return true; } else { return false; } } } </script> 

希望它可以帮助你。

也许你可以使用[Integer]数据注释(如果使用DataAnnotationsExtensions http://dataannotationsextensions.org/ )。 然而,这只会检查值是一个整数,如果它是填充的(所以你可能还需要[必需的]属性)。

如果启用Unobtrusive Validation,它将validation它在客户端,但是您也应该在您的POST操作中使用Modelstate.Valid来拒绝它,以防人们禁用Javascript。

DataType有一个接受string的第二个构造函数。 但是,在内部,这实际上与使用UIHint属性相同。

添加一个新的核心数据types是不可能的,因为DataType枚举是.NET框架的一部分。 您可以做的最接近的事情是创build一个从DataTypeAttributeinheritance的新类。 然后,您可以添加一个新的构造函数与您自己的DataType枚举。

 public NewDataTypeAttribute(DataType dataType) : base(dataType) { } public NewDataTypeAttribute(NewDataType newDataType) : base (newDataType.ToString(); 

你也可以通过这个链接。 但我会推荐你​​使用JQuery的相同。

嗨尝试以下….

 <div class="editor-field"> <%: Html.TextBoxFor(m => m.UserName, new {onkeydown="return ValidateNumber(event);" })%> <%: Html.ValidationMessageFor(m => m.UserName) %> </div> 

脚本

 <script type="text/javascript"> function ValidateNumber(e) { var evt = (e) ? e : window.event; var charCode = (evt.keyCode) ? evt.keyCode : evt.which; if (charCode > 31 && (charCode < 48 || charCode > 57)) { return false; } return true; };