Question

我想验证用户输入的数字是否存在于数据库中，因此我有一个操作来返回JSON对象并在发布到服务器之前检查输入。问题是它总是返回错误。

Javascript：

<script type="text/javascript">
        var pid = $("#ProductID").val();
        var flag = false;

        $("#button1").click(function () {
            $.get('/Invoice/GetData',
                function (data) {
                    for (var i = 0; i < data.length; i++) {
                        if (data[i] == pid) {
                            flag = true;
                        }
                    }
                });
            if (flag == false) {
                alert("Invalid Product ID");
                location.reload();
                return false;
            }
            else {
                alert("validations passed");
                return true;
            }
        });
</script>

表单（ASP.NET MVC4）

@using (Html.BeginForm("AddInvoiceDetails","Invoice",FormMethod.Post)) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Invoice_Detail</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.InvoiceID)
        </div>
        <div class="editor-field">
            @Html.TextBox("InvoiceID", (String)ViewBag.invoiceid,new { @readonly="readonly" })
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ProductID)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model=>model.ProductID)
            @Html.ValidationMessageFor(model => model.ProductID)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Quantity)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Quantity)
            @Html.ValidationMessageFor(model => model.Quantity)
        </div>

        <p>
            <input id="button1" type="submit" value="Create" />
        </p>
    </fieldset>
}

Answer 1

您正在使用异步的ajax，因此您的if语句将在执行$.get()之前执行。你可以这样做：

    $("#button1").click(function (event) {  
        $.get('/Invoice/GetData',
            function (data) {
                for (var i = 0; i < data.length; i++) {
                    if (data[i] == pid) {
                        flag = true;
                    }
                }
                if (flag == false) {
                    alert("Invalid Product ID");
                    location.reload();
                    event.preventDefault(); //prevents post to server
                }
                else {
                    alert("validations passed");                
                }
        }); 
});

Answer 2

在朋友的帮助下找到解决方案，所有其他答案确实有帮助。解决方案是将"button1"的类型更改为按钮，并在验证为真时提交表单，如果为false则显示对话框。代码：

使用Javascript：

<script type="text/javascript">
        $("#button1").live("click",function (event) {
            $.get('/Invoice/GetData',
                function (data) {
                    var pid = $("#ProductID").val();
                    var flag = false;
                    for (var i = 0; i < data.length; i++) {
                        if (data[i] == pid) {
                            flag = true;
                        }
                    }
                    if (flag == false) {
                        alert("Invalid Product ID");
                        return false;
                    }
                    else {
                        $("#myform").submit();
                        return true;
                    }
                });
        });

表单（ASP.NET MVC4）

@using (Html.BeginForm("AddInvoiceDetails", "Invoice", FormMethod.Post, new { id = "myform", data_ajax = "false" }))
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Invoice_Detail</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.InvoiceID)
        </div>
        <div class="editor-field">
            @Html.TextBox("InvoiceID", (String)ViewBag.invoiceid, new { @readonly = "readonly" })
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.ProductID)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.ProductID)
            @Html.ValidationMessageFor(model => model.ProductID)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Quantity)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Quantity)
            @Html.ValidationMessageFor(model => model.Quantity)
        </div>
        <p>
            <input id="button1" type="button" value="Create" />
        </p>
    </fieldset>
}

验证为false但表单仍然提交

2 个答案: