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