У меня есть текстовое поле, которое принимает значения почтового индекса, номера мобильного телефона и номера жилого помещения. Я получил решение разрешить только номер в текстовом поле, используя jquery из сообщения Bellow.
Я хотел бы сделать только текстовые поля для редактирования EditFor
но можем ли мы это сделать, используя аннотации данных, поскольку я использую бритву MVC4?
Я просто играл с HTML5 input type = number. в то время как он не поддерживается всеми браузерами, я ожидаю, что это будет способ обработки специфичной обработки типа (число для ex). довольно просто сделать с бритвой (например, VB)
@Html.TextBoxFor(Function(model) model.Port, New With {.type = "number"})
и благодаря Ли Ричардсону, С# way
@Html.TextBoxFor(i => i.Port, new { @type = "number" })
выходит за рамки вопроса, но вы можете сделать такой же подход для любого типа ввода html5
Используйте регулярное выражение, например.
[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" })
в MVC 5 с помощью Razor вы можете добавить любой атрибут ввода html в анонимный объект в соответствии с приведенным выше примером, чтобы разрешить только положительные числа в поле ввода.
в текстовом поле напишите этот код 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>
Это сработало для меня:
<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);
}
});
Используйте эту функцию в своем script и поставьте диапазон рядом с текстовым полем, чтобы отобразить сообщение об ошибке
$(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>
Пожалуйста, используйте атрибут DataType, но это будет за исключением отрицательных значений, поэтому регулярное выражение ниже позволит избежать этого
[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 ?
Нет, поскольку я понимаю ваш вопрос, ненавязчивая валидация покажет только эрозии. Самый простой способ - использовать плагин jquery:
Вот 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, он будет проверять его на стороне клиента, но вы также должны использовать Modelstate.Valid в своем действии POST, чтобы отклонить его, если у людей отключен Javascript.
DataType имеет второй конструктор, который берет строку. Однако внутренне это на самом деле то же самое, что и атрибут UIHint.
Добавление нового ядра DataType невозможно, так как перечисление DataType является частью платформы .NET. Самое близкое, что вы можете сделать, это создать новый класс, который наследуется от DataTypeAttribute. Затем вы можете добавить новый конструктор с собственным перечислением 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
<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;
};
для десятичных значений больше нуля, HTML5 работает следующим образом:
<input id="txtMyDecimal" min="0" step="any" type="number">
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;
}}