javascript - 在按钮上单击如果文本框值为空则使用 asp.net mvc 显示警报？

Question

按钮btnClick单击，如果用户提交带有空MedicineName文本字段的表单，我想提醒用户。如果MedicineName文本框值为空表示弹出不隐藏。

在我的代码中，在按钮单击警报消息时显示同时弹出窗口也正在加载

$("#btnClick").click(function () {
                var id = jQuery('[id$=hfCustomer]').val();
                if (id == '') {
                    alert('MedicineNameis empty');
                    $("#upload3Modal").hide();
                }
                else {
                    $.get("GenericName_Bind", { ProductID: id }, function (data) {
                        $.each(data, function (i, v1) {
                            var GenID = v1.Value;
                            if (GenID) {
                                $('#hdnGenericID').val(GenID);
                            }
                            $('#txtGenericName').val(v1.Text);
                        });

                    });
                }

            });

HTML:

<div class="col-lg-4">
                            <fieldset class="form-group">
                                <label class="form-label" for="exampleInput">MedicineName</label>
                                @*@Html.TextBoxFor(model => Model.MedicineName, new { @class = "form-control", @id = "txtMedicineName", placeholder = "MedicineName" })*@
                                <div class="typeahead-container">
                                    <div class="typeahead-field">
                                        <span class="typeahead-query">
                                            @Html.TextBoxFor(model => Model.prescriptionmanagement.MedicineName, new { @class = "form-control", @id = "txtMedicineName", placeholder = "Medicine Name", name = "d", type = "search", autocomplete = "off" })
                                            <input type="hidden" id="hfCustomer" name="CustomerId" />
                                        </span>
                                    </div>
                                </div>
                                @Html.ValidationMessageFor(model => Model.prescriptionmanagement.MedicineName, null, new { @style = "color: red" })
                            </fieldset>
                        </div>
                        <div class="col-lg-4">
                            <fieldset class="form-group">
                                <label class="form-label" for="exampleInput">Drug Specifications</label>
                                <div class="tbl-cell tbl-cell-action button">
                                    <a href="#" data-toggle="modal" id="btnClick" data-target="#upload3Modal" class="btn btn-rounded btn-block">Drug Specifications&nbsp;&nbsp;<span class="font-icon-search"></span></a>
                                </div>
                            </fieldset>
                        </div>

Answer 1

尝试模态隐藏完成功能

Bootstrap 3

$('#upload3Modal').on('hidden.bs.modal', function () {
    alert('MedicineNameis empty')
})

Bootstrap 2.3.2

$('#upload3Modal').on('hidden', function () {
     alert('MedicineNameis empty')
})

引用

https://getbootstrap.com/docs/3.3/javascript/

https://getbootstrap.com/2.3.2/javascript.html#modals