在按钮单击文本框值是空的使用 asp.net mvc 显示警报？

Posted 2023-05-08

【中文标题】在按钮单击文本框值是空的使用 asp.net mvc 显示警报？

【英文标题】：On button Click if texbox value is empty show alert using asp.net mvc?

【发布时间】：2018-05-11 11:42:15

【问题描述】：

在按钮btnClick 点击我想提醒用户如果他们提交带有空MedicineName 文本字段的表单。如果MedicineName texbox 值为空意味着弹出不隐藏。

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

$("#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>

【问题讨论】：

您为什么不通过向您的属性添加[Required] 属性并包括@Html.ValidationMessageFor() 来执行此操作，以便您获得开箱即用的客户端和服务器端验证

ValidationMessageFor 在我单击 id="btnClick" 时工作正常，弹出窗口加载了空文本框@StephenMuecke

如果它工作正常，那么你到底为什么需要一个弹出窗口 - 错误消息将显示在你的 ValidationMessageFor() 占位符中（很明显它不工作正常. 你处理表单的.submit() 事件并测试$(this).valid() 的值，如果不是则取消ajax 调用

好的先生，非常感谢@StephenMuecke

而且您甚至没有显示以id 开头的html for and 元素hfCustomer

【参考方案1】：

尝试模态隐藏完成功能

引导程序 3

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

引导程序 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

【讨论】：

把它放在你的 if (id == '') 块中