Comment autoriser uniquement les nombres dans la zone de texte dans le razor mvc4

J’ai 3 zones de texte qui prennent les valeurs du code postal et du numéro de portable et du numéro résidentiel. J’ai eu la solution pour n’autoriser que le numéro dans la zone de texte en utilisant jquery de Bellow post.

Je voudrais faire une zone de texte EditFor accepter uniquement les numéros

mais pouvons-nous faire cela en utilisant des annotations de données comme j’utilise le razor MVC4?

Je jouais juste avec le type d’entrée HTML5 = number. Bien que ce ne soit pas supporté par tous les navigateurs, je pense que c’est la voie à suivre pour gérer le traitement spécifique au type (nombre pour ex). assez simple à faire avec le razor (ex VB)

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

et merci à Lee Richardson, le c # way

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

au-delà de la scope de la question, mais vous pouvez faire cette même approche pour tout type d’entrée html5

Utilisez une expression régulière, par exemple

 [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" }) 

Dans MVC 5 avec Razor, vous pouvez append n’importe quel atsortingbut d’entrée HTML dans l’object anonyme, comme dans l’exemple ci-dessus, pour n’autoriser que des nombres positifs dans le champ de saisie.

dans le textbox écrivez ce code onkeypress="return isNumberKey(event)" et la fonction pour ceci est juste en dessous.

  

Cela a fonctionné pour moi:

  

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

S’il vous plaît utiliser l’atsortingbut DataType, mais cette volonté sauf les valeurs négatives afin que l’expression régulière ci-dessous évitera cela

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

Utilisez cette fonction dans votre script et placez un span près de la zone de texte pour afficher le message d’erreur

  $(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" })  

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

Non, comme je comprends votre question, la validation discrète ne montrera que des erorrs. Le moyen le plus simple est d’utiliser le plugin jquery:

Plugin d’entrée masqué

Voici le javascript qui vous permettra d’entrer uniquement des chiffres.

Abonnez-vous à l’événement onkeypress pour la zone de texte.

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

Voici le javascript pour cela:

  

J’espère que ça vous aide.

Vous pouvez peut-être utiliser l’annotation de données [Integer] (si vous utilisez le DataAnnotationsExtensions http://dataannotationsextensions.org/ ). Cependant, cela ne vérifiera que si la valeur est un entier, nót si elle est renseignée (vous aurez donc besoin de l’atsortingbut [Required]).

Si vous activez la validation non intrusive, elle le validera côté client, mais vous devez également utiliser Modelstate.Valid dans votre action POST pour le refuser au cas où Javascript serait désactivé.

DataType a un deuxième constructeur qui prend une chaîne. Cependant, en interne, cela revient à utiliser l’atsortingbut UIHint .

L’ajout d’un nouveau DataType de base n’est pas possible, car l’énumération DataType fait partie du framework .NET. La chose la plus proche que vous puissiez faire est de créer une nouvelle classe qui hérite de DataTypeAtsortingbute . Vous pouvez ensuite append un nouveau constructeur avec votre propre énumération DataType .

 public NewDataTypeAtsortingbute(DataType dataType) : base(dataType) { } public NewDataTypeAtsortingbute(NewDataType newDataType) : base (newDataType.ToSsortingng(); 

Vous pouvez également passer par ce lien. Mais je vous recommande d’utiliser Jquery pour la même chose.

Bonjour essayez ce qui suit ….

 
< %: Html.TextBoxFor(m => m.UserName, new {onkeydown="return ValidateNumber(event);" })%> < %: Html.ValidationMessageFor(m => m.UserName) %>

SCÉNARIO

  

Pour les valeurs décimales supérieures à zéro, HTML5 fonctionne comme suit:

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