在MVC(Razor)中使用Jquery验证文本框中的数字

本文关键字：验证 文本 数字 Jquery MVC Razor | 更新日期: 2023-09-27 18:17:48

我有这个:

@Html.TextBoxFor(cModel => cModel.Value, new { id = "txtbLimit", @type = "int" })

我想确保用户输入的是一个整数

我该怎么做呢?

编辑:我不解析这个文本框与一个模型的值，所以模型验证不是我想要的

EDIT2:

模型:

public class StorageConfigurationModel
{
    [Required]
    public int QueueMonitorConfigurationsID { get; set; }
    [Required]
    public PathType QueueMonitorConfigTypeName { get; set; }
    [Required]
    public string Location { get; set; }
    [Required]
    public UnitType QueueMonitorValueTypeName { get; set; }
    [Required]
    public ThresholdType Threshold { get; set; }
    [Required]
    [RegularExpression(@"'d*")]
    public int Value { get; set; }
}
public enum PathType
{
    Path
}
public enum UnitType
{
    MB, GB, TB, Files, Percentage
}
public enum ThresholdType
{
    Upper, Lower
}
解析功能:

    private static StorageConfigurationModel BindToModel(int id, string pathType, string threshold, string valueType, string location, int limit)
    {
        return new StorageConfigurationModel
        {
            QueueMonitorConfigurationsID = id,
            QueueMonitorConfigTypeName = (PathType)Enum.Parse(typeof(PathType), pathType),
            Location = Convert.ToString(location.Trim()),
            Value = Convert.ToInt32(limit),
            QueueMonitorValueTypeName = (UnitType)Enum.Parse(typeof(UnitType), valueType),
            Threshold = (ThresholdType)Enum.Parse(typeof(ThresholdType), threshold)
        };
    }

所以当我把所有的数据放入我的视图并点击add时，什么都不会被触发。

我调用调用模型绑定器的函数:

        $.post('@Url.Action("AddUpdateConfigs")',
            {id: @Model.QueueMonitorConfigurationsID , pathType: $('#ddlConfigTypeName').val(), threshold:$('#ddlThreshold').val(), valueType:$('#ddlValueTypeName').val(), location: $('#txtbLocation').val(), limit: $('#txtbLimit').val(), config: $('#NewOrUpdate').val() },
            function(data){
                if (!data.Success){
                    alert(data.Description);
                }
                else{
                    //$('#gridView').load('/Storage/gvConfigurations');
                    $.get('@Url.Action("gvConfigurations", "Storage")',null,function(data){$('#gridView').html(data);},'html');
                }
            },'json');

在MVC(Razor)中使用Jquery验证文本框中的数字

在您的模型中，将此属性添加到Value的顶部:

[RegularExpression(@"('d+)")]

和MVC将在它返回到POST中的控制器之前将其设置为无效的服务器端-然后您可以轻松地正确处理它。

现在，如果你设置在JavaScript中使用它，那么使用这个方法:

function isNumber(n) {
  return !isNaN(parseFloat(n)) && isFinite(n);
}

然后你可以像这样在onkeydown事件中运行它:

onkeydown="return isNumber(this.value);"

编辑

要在那里获得错误消息，应该能够这样做:

[RegularExpression(@"('d+)", ErrorMessage="Please enter numeric values only.")]

我认为你可以使用与你的用户界面元素匹配的ViewModel类，而不是直接使用你的Model类将信息传递给post动作。

例如:

public class StorageConfigurationViewModel
{
[Required()]
public int pathType {get;set;}
[Required()]
public int threshold {get;set;}
[Required()]
public int valueType {get;set;}
[Required()]
public int location {get;set;}
[Required()]
public int limit {get;set;}
[Required()]
public int config {get;set;}
}
相关文章：