如何让在mvc4剃刀在文本框中只有数字(How to allow only numbers in t

2019-07-19 09:20发布

我有3个文本框,其取值邮政编码和手机号码和住宅电话。 我得到的解决方案使用jQuery从娄后允许文本框中只数。

我想提出一个EditFor文本框只接受数字

但我们可以做到这一点使用数据注解我使用MVC4剃须刀?

Answer 1:

我只是玩弄HTML5输入类型=数字。 虽然它不是所有浏览器都支持我希望它是向前来处理特定类型的处理(为前数)的方式。 很简单,用剃刀做(当然是VB)

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

并感谢李·理查森,C#的方式

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

超越了问题的范围,但你可以做任何HTML5输入类型同样的方法



Answer 2:

使用正则表达式,如

[RegularExpression("([1-9][0-9]*)", ErrorMessage = "Count must be a natural number")]
public int Count { get; set; }


Answer 3:

@Html.TextBoxFor(m => m.PositiveNumber, 
                      new { @type = "number", @class = "span4", @min = "0" })

在MVC 5与剃刀可以在匿名对象按添加任何HTML输入属性例如以上仅允许正数到输入字段中。



Answer 4:

在文本框中写这个代码onkeypress="return isNumberKey(event)"和函数为这仅仅是下面。

<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>


Answer 5:

请使用数据类型attribue但这除外负值,因此正则表达式如下为了避免这

   [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; }


Answer 6:

这为我工作:

<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);
    }
});


Answer 7:

在脚本中使用此功能,把一个跨度近文本框来显示错误信息

    $(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>


Answer 8:

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

不,我明白你的问题,不引人注目的验证将只显示erorrs。 最简单的方法是使用jQuery插件:

蒙面输入插件



Answer 9:

这里是将允许你只输入数字的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>

希望它可以帮助你。



Answer 10:

也许你可以使用[整数]数据注释(如果使用DataAnnotationsExtensions http://dataannotationsextensions.org/ )。 然而,这仅WIL检查,如果该值是一个整数,而不是是否填充(所以您可能还需要在[必需]属性)。

如果启用不显眼的验证,将验证其客户方,但你也应该使用Modelstate.Valid在POST操作,从而拒绝的情况下,人们已禁用JavaScript。



Answer 11:

为十进制值大于零,HTML5的工作原理如下:

<input id="txtMyDecimal" min="0" step="any" type="number">


Answer 12:

DataType有第二构造函数的字符串。 但是,在内部,这其实是一样的使用UIHint属性。

由于添加新的数据类型的核心是不可能的DataType枚举是.NET框架的一部分。 你可以做的最接近的事是创建一个从继承的新类DataTypeAttribute 。 然后,你可以用自己添加一个新的构造DataType枚举。

public NewDataTypeAttribute(DataType dataType) : base(dataType)
 { }

public NewDataTypeAttribute(NewDataType newDataType) : base (newDataType.ToString();

你也可以去通过这个链接。 但我会建议你使用jQuery的一样。



Answer 13:

嗨尝试以下....

<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;
   };


Answer 14:

function NumValidate(e) {
    var evt = (e) ? e : window.event;
    var charCode = (evt.keyCode) ? evt.keyCode : evt.which;
    if (charCode > 31 && (charCode < 48 || charCode > 57)) {
        alert('Only Number ');
        return false;
    }    return true;
}  function NumValidateWithDecimal(e) {

var evt = (e) ? e : window.event;
var charCode = (evt.keyCode) ? evt.keyCode : evt.which;

if (!(charCode == 8 || charCode == 46 || charCode == 110 || charCode == 13 || charCode == 9) && (charCode < 48 || charCode > 57)) {
    alert('Only Number With desimal e.g.: 0.0');
    return false;
}
else {
    return true;
} } function onlyAlphabets(e) {
try {
    if (window.event) {
        var charCode = window.event.keyCode;
    }
    else if (e) {
        var charCode = e.which;
    }
    else { return true; }

    if ((charCode > 64 && charCode < 91) || (charCode > 96 && charCode < 123) || (charCode == 46) || (charCode == 32))
        return true;
    else
        alert("Only text And White Space And . Allow");
    return false;

}
catch (err) {
    alert(err.Description);
}} function checkAlphaNumeric(e) {

if (window.event) {
    var charCode = window.event.keyCode;
}
else if (e) {
    var charCode = e.which;
}
else { return true; }

if ((charCode >= 48 && charCode <= 57) || (charCode >= 65 && charCode <= 90) || (charCode == 32) || (charCode >= 97 && charCode <= 122)) {
    return true;
} else {
    alert('Only Text And Number');
    return false;
}}


文章来源: How to allow only numbers in textbox in mvc4 razor