Question

我目前有一个表单，根据用户的意图会带来不同的报告。但是，每当我在没有输入数据的情况下提交表单时，我都会收到一条错误消息，我不想让用户看到。为了解决这个问题，我想阻止用户在没有输入数据的情况下提交表单。

HTML：

<content id="GenerateReportContent" class="col-md-4">
    @ViewBag.ErrorMessage
    @using (Html.BeginForm("ReportSelection", "Reports", FormMethod.Post, new { @id = "GenerateReportContainer" })) {
        <div class="AltFunctions">
            <ul>
                <li>
                    <a href="javascript:document.getElementById('GenerateReportContainer').reset();" class="AltButton" id="altClearButton">Clear</a>
                </li>
                <li>
                    <a href="#" class="AltButton" id="GRaltInfoButton">Info</a>
                </li>
            </ul>
        </div>

        <h1 id="GenerateReportHeader">GENERATE REPORT</h1>

        <input type="hidden" name="ClientID" value="@Model.ClientID" />

        @Html.TextBox("ClaimNo", "", new { @id = "txtGRCSelect", @class = "form-control", placeholder = "Enter Specific Claim Number..." })
        <p id="txtOptional">(optional)</p>

        @Html.DropDownListFor(m => m.ReportTypeOptions.First().ReportID, new SelectList(Model.ReportTypeOptions, "ReportID", "ReportName"), "Select Report", new { @class = "GRDropDown", @id = "ReportDD", onchange = "disableFunction()" })
        <br />

        @Html.DropDownListFor(m => m.SupplierID, new SelectList(Model.Suppliers, "SupplierID", "DisplayName"), "Select Supplier Name", new { @id = "SuppNameDD", @class = "GRDropDown", disabled = true })
        @Html.ValidationMessageFor(m => m.SupplierID, "", new { @class = "text-danger" })
        <br />

        @Html.DropDownListFor(m => m.ReviewPeriodID, new SelectList(Model.ReviewPeriods, "ReviewPeriodID", "ReviewPeriodName"), "Select Review Period", new { @id = "ReviewPeriodDD", @class = "GRDropDown", disabled = true })
        @Html.ValidationMessageFor(m => m.ReviewPeriodID, "", new { @class = "text-danger" })

        <div class="form-group">
            @Html.TextBox("MonthCode", "", new { @id = "txtGRC", @class = "form-control", placeholder = "Enter Month Code...", disabled = true, onchange = "submitFunction" })
            <p id="txtOptional">(optional)</p>

        </div>
        <button type="submit" value="Submit" id="GenerateReportButton" class="btn btn-default">GO</button>
    }
</content>

JQUERY：

  function disableFunction() {
            if ($("#ReportDD").val() == '0') {
                $('#SuppNameDD').prop('disabled', false);
                $('#ReviewPeriodDD').prop('disabled', false);

            }
            else if ($("#ReportDD").val() == '1') {
                $('#SuppNameDD').prop('disabled', false);
                $('#ReviewPeriodDD').prop('disabled', false);
            }
            else if ($("#ReportDD").val() == '2') {
                $('#SuppNameDD').prop('disabled', false);
                $('#ReviewPeriodDD').prop('disabled', false);
            }
            else if ($("#ReportDD").val() == '3') {

                $('#ReviewPeriodDD').prop('disabled', false);
                $('#txtGRC').removeAttr('disabled');
            }
        };

我对JQuery完全陌生，因此不知道该怎么做。我已经研究过JQuery验证但不了解如何使用它。

Answer 1

CanBuildFrom

单击按钮后，检查所有字段是否为空

1 个答案: