Question

我有一个按钮，我正在使用bootstrap 3模态。这是一个ASP.NET Webforms应用程序。单击按钮时，它会尝试提交表单，我可以告诉，因为正在触发验证摘要。我已经将按钮类型设置为按钮。我还在onclick事件上尝试了e.preventDefault（）。 Button1会发生这种情况。如何在仍然具有服务器端点击事件回发的同时阻止按钮提交表单？

我的模态

<div id="verifiedApplicantAddress" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">Validate Residence Address</h4>
            </div>
            <div class="modal-body">
                <h2>
                    We've found a possible match in the USPS database.
                </h2>
                <p>Please select the best match</p>
                <ul style="list-style:none; float:left;">
                    <li>
                        <b>
                            Corrected address:
                        </b>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="verifiedLine1"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="verifiedLine2"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="verifiedCity"></asp:Label>
                    </li>
                    <li>
                        <asp:Label ID="verifiedState" runat="server"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="verifiedZip"></asp:Label>
                    </li>
                </ul>
                <ul style="list-style:none; float:left;">
                    <li>
                        <b>
                            Address as entered:
                        </b>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="residenceEnteredLine1"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="residenceEnteredLine2"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="residenceEnteredCity"></asp:Label>
                    </li>
                    <li>
                        <asp:Label ID="residenceEnteredState" runat="server"></asp:Label>
                    </li>
                    <li>
                        <asp:Label runat="server" ID="residenceEnteredZip"></asp:Label>
                    </li>
                </ul>
            </div>
            <div class="modal-footer" style="margin-top: 100px;">
                <button type="button" class="btn btn-default" data-dismiss="modal">Use Address as Entered</button>
                <button type="button" runat="server" ID="Button1" class="btn btn-primary" OnServerClick="Button1_Click">Accept Changes</button>
            </div>
        </div>
    </div>
</div>

服务器端点击事件

Protected Sub Button1_Click(sender As Object, e As EventArgs)
    txtApplicantAddress1.Text = verifiedLine1.Text
    txtApplicantAddress2.Text = verifiedLine2.Text
    txtApplicantCity.Text = verifiedCity.Text
    txtApplicantZip.Text = verifiedZip.Text
    ScriptManager.RegisterStartupScript(Me, Me.GetType, "HideVerifiedApplicantAddress", "$('#verifiedApplicantAddress').modal('hide');$('.modal-backdrop').remove();$('body').removeClass('modal-open');", True)
End Sub

的javascript

$('button:not([type=submit])').on('click',
        function(e) {
            e.preventDefault();
            return true;
        });

Answer 1

在我的asp：Button元素上使用UseSubmitBehavior =“ false”属性为我解决了此问题

但是，请注意这一点，因为这会将asp：Buttons的HTML从type =“ submit”转换为type =“ button”。因此，就我而言，我必须调整一些CSS以适应这些更改。

我本来会发表评论，但您要发表评论要多于回答...不确定原因。

Answer 2

你可以使用：

document.getElementById("Button").disabled = true;

或启用：

document.getElementById("Button").disabled = false;

我不明白为什么你需要回传思想？

Answer 3

解决方案是在按钮上将CausesValidation属性设置为false。

<button type="button" runat="server" ID="Button1" class="btn btn-primary" OnServerClick="Button1_Click" CausesValidation="False">Accept Changes</button>

Answer 4

我在每个按钮标签提交的表单中都有类似的地方。可能与您无关，但仅针对那些通过相同搜索访问此页面的人：每个按钮标签都提交其所在的表单。 / p>

所以我有：

GRANT USAGE ON *.\* TO 'tester'@'localhost' IDENTIFIED BY 'Pass123#d'
SET PASSWORD FOR 'tester'@'localhost' = PASSWORD('Pass123#d');

并使用以下方法修复了自动提交：

<button class="btn" role="button" onclick="javascript:loadAnotherPage();">Go</button>

提交表单停止按钮

我的模态

服务器端点击事件

的javascript

4 个答案: