当它是一个数字时,不引人注意的验证会触发“必须是数字”

时间:2018-01-16 16:23:57

标签: jquery asp.net-mvc unobtrusive-validation

我有一个带有2个下拉菜单的模态视图,用户选择一个或另一个。用户进行选择后,将使用Get调用动态填充第三个下拉列表。最后,通过将值从“GET”返回值中切除来填充字段。

涉及的属性是GID(字符串),SeedId(int?)和BinId(int)

GID和SeeId有2个下降。通常GID实际上是数字,但偶尔它是alpha或字母数字,因此是字符串类型。即使用户没有从下拉列表中选择SeedId,我也需要它来保存实体。

我遇到的问题是当用户从GID ddl中选择并且值是alpha或字母数字时,我收到错误“SeedID必须是数字”。这对我没有意义,因为无论选择哪个GID,SeedId总是一个数字。

现在有些代码:

模特:

    public int? SeedId { get; set; 
    public string GID { get; set; }
    public int BinId { get; set; }

    public IEnumerable<SelectListItem> SeedOptionList { get; set; }
    public IEnumerable<SelectListItem> BinOptionList { get; set; }
    public IEnumerable<SelectListItem> GIDOptionList { get; set; }

观看代码:

<div id="container-gid-search" class="hidden">
    <div class="form-group">
        @Html.LabelFor(model => model.GID, htmlAttributes: new { @class = "control-label" })
        @Html.DropDownListFor(model => model.GID, Model.GIDOptionList, "Select GID...", new { @class = "form-control auto-complete" })
        @Html.ValidationMessageFor(model => model.GID, "", new { @class = "text-danger" })
    </div>
</div>
<div id="container-seed-search" class="hidden">
    <div class="form-group">
        @Html.LabelFor(model => model.SeedId, htmlAttributes: new { @class = "control-label" })
        @Html.DropDownListFor(model => model.SeedId, Model.SeedOptionList, "",new { @class = "form-control auto-complete" })
        @Html.ValidationMessageFor(model => model.SeedId, "", new { @class = "text-danger" })
    </div>
</div>

<div class="form-group">
    @Html.LabelFor(model => model.BinId, htmlAttributes: new { @class = "control-label" })
    @Html.DropDownListFor(model => model.BinId, new SelectList(string.Empty, "Value", "Text"), new { @class = "form-control" })
    @Html.ValidationMessageFor(model => model.KGBalance, "", new { @class = "text-danger" })
    @Html.ValidationMessageFor(model => model.BinId, "", new { @class = "text-danger" })
</div>

填充bin列表并填充种子id字段以保存的jquery:

$("#GID").on("change", function () {
    var gid = $(this).val();
    $("#BinId").empty();
    $.get({
        url: binUrl,
        data: { gid: gid},
        success: function (response) {
            $.each(response, function (index, item) {
                $("#BinId").append($('<option value="' + item.Value + '">' + item.Text + '</option>'));
            });

            //Pull the kilo value out of the selected bin and put it in the balance window.
            $("#KGBalance").val(SliceDecimalFromString($("#BinId option:selected").text()));

            //Grab the seedid and put it in the SeedId fields.
            var seedId = ExtractDecimalFromString($("#BinId option:selected").text(), '# ');
            $("input[name='SeedId']").val(seedId);
            $('#SeedId').val(seedId);

            var balance = $("#KGBalance").val() - $("#KGExtracted").val();
            $("#KGBalanceCheck").val(balance);
        }
    })
})



$("#BinId").on("change", function () {
    $("#KGBalance").val(SliceDecimalFromString($("#BinId option:selected").text()));

    if ($("#GID").val() !== "") {
        //Grab the seedid and put it in the SeedId fields.
        var seedId = ExtractDecimalFromString($("#BinId option:selected").text(), '# ');
        $("input[name='SeedId']").val(seedId);
        $('#SeedId').val(seedId);
    }
    //Do some other stuff that is unrelated
})

function ExtractDecimalFromString(stringIn, delimiter) {
    var kgString = stringIn;
    var idx = kgString.indexOf(delimiter);
    var strOut = kgString.substr(idx + 2);

    var intOut = parseInt(strOut);
    return intOut;
}

如果我将模型中的SeedId更改为字符串,它可以正常工作。我不知道为什么选择的GID是字母数字有所不同,但这是错误发生的唯一时间。

注意:我在SeedId选择列表中使用此引导样式组合框脚本:https://github.com/danielfarrell/bootstrap-combobox。我提到它是因为它通过添加一个名称但没有ID的隐藏SeedId字段来更改下拉列表的渲染html,这就是jquery脚本将Seedid放入命名字段和ID字段的原因。

这是实际呈现的HTML。我得到的错误来自选择列表,“种子参考必须是一个数字”

<div class="form-group">
   <label class="control-label" for="SeedId">Seed Ref:</label>
   <div class="combobox-container"> <input type="hidden" class="do-not-ignore" name="SeedId" value="9608"> 
       <div class="input-group"> 
            <input type="text" autocomplete="off" id="SeedIdundefined" placeholder="" class="form-control auto-complete"> 
            <span class="input-group-addon dropdown-toggle" data-dropdown="dropdown"><span class="caret"></span><span class="glyphicon glyphicon-remove"></span></span> 
        </div> 
    </div>
    <select class="form-control auto-complete" data-val="true" data-val-number="The field Seed Ref: must be a number." id="SeedId" style="display: none;">
        <option value=""></option>
        <option value="10439">10439</option>
        <option value="10438">10438</option>
        <option value="10437">10437</option>
        <option value="10436">10436</option>
    ...
    </select>
<span class="field-validation-valid text-danger" data-valmsg-for="SeedId" data-valmsg-replace="true"></span>
</div>

我也想知道为什么当SeedId是一个可以为空的int时它会触发验证。

0 个答案:

没有答案