使用MVC中的Jquery验证文本框中的数字（Razor）

Question

我有这个：

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

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

我怎样才能做到这一点？

编辑：我不使用模型的值解析此textBox，因此模型验证不是我想要的

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

因此，当我将所有数据放在我的视图中并单击添加时，不会触发任何内容。

有了这个，我调用调用modelbinder的函数：

        $.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');

Answer 1

在您的模型上，将此属性添加到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.")]

Answer 2

我认为您可以使用与您的用户界面元素匹配的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;}
}