使用 jquery 和 bootstrap 进行验证并没有发生单击事件答案

【问题标题】：validation with jquery and bootstrap and click event doesn't occured使用 jquery 和 bootstrap 进行验证并没有发生单击事件
【发布时间】：2014-08-05 07:20:45
【问题描述】：

我是 JQuery 的新手，我想在我的 Web 表单中使用 Jquery Bootstrap 验证来验证控件。

这里是html：

 <div class="form-group">
 <div class=" col-lg-6">
 <label for="txtGroupName" class="req"> نام گروه </label>
 <asp:TextBox ID="txtGroupName" CssClass="required form-control text-right" runat="server"></asp:TextBox>
 </div>
 <div class="col-md-2">
 <br />
 <asp:Button OnClick="submitbtn_Click" ID="submitbtn" Width="100px" Height="40px"  CssClass="btn btn-success submit-btn"  runat="server" Text="جستجو" />
 </div>
 </div>

和：

$(function () {
$('#signinform').validate_popover({ onsubmit: false, popoverPosition: 'top' });

$(".submit-btn").click(function (ev) {
    ev.preventDefault();
    $('#signinform').validate().form();
    return false;
});

$(window).resize(function () {
    $.validator.reposition();
});
});

所有的事情都是真的并且验证正在工作，但是当我在我的文本框中输入一个字符串值 (id=txtGroupName) 然后单击我的按钮 (id=submitbtn) 时，该控件的按钮单击事件不会发生 (OnClick ="submitbtn_Click")。

如果我像这样更改这个控件 cssclass：

<asp:Button OnClick="submitbtn_Click" ID="submitbtn" Width="100px" Height="40px"  CssClass="btn btn-success" runat="server" Text="جستجو" />

OnClick="submitbtn_Click" 有效。验证后我需要对我的功能进行哪些更改才能触发OnClick="submitbtn_Click"？

【问题讨论】：

标签： jquery asp.net validation jquery-validate

【解决方案1】：

.submit-btn 的 jQuery click 事件处理程序正在停止对 click 事件的任何进一步执行，包括提交表单，因为您正在手动调用 e.preventDefault 并返回 false。请注意，从 jQuery 事件处理程序返回 false 与调用 e.preventDefault 和 e.stopPropagation 相同。（见SO answer）。

因此，您应该仅在验证失败时才停止提交表单。由于validator.form() 验证表单，如果有效则返回true，否则返回false（参见validator docs），您可以编写以下jQuery click 事件处理程序：

$(".submit-btn").click(function (ev) {
    return $('#signinform').validate().form();
});

当验证失败时应该返回 false（取消点击事件），否则返回 true（让帖子发生，它应该到达服务器并执行你的服务器端 submitbtn_Click）。

希望对你有帮助！

【讨论】：