JavaScript表单提交不会触发提交按钮的asp服务器端点击功能答案

【问题标题】：JavaScript form submit doesn't fire asp server-side click function of the submit buttonJavaScript表单提交不会触发提交按钮的asp服务器端点击功能
【发布时间】：2012-09-02 03:02:26
【问题描述】：

我使用事件侦听器来阻止我的 asp:button（提交）的操作，因为我想在实际提交之前使用 javascript 函数验证我的表单。

formInstance.addEventListener('submit', function (event) {
    event.preventDefault(); 
}, false);

这是按钮：

<asp:Button ID="btnCreateForm" CssClass="submit-form button" runat="server" 
    Text="Save Form" OnClick="btnCreateForm_Click" 
        OnClientClick="Sharpforms.checkFormEntry()" />

被触发的javascript：

checkFormEntry: function () {
    var formName = document.getElementById("txtFormName");

    if (formName.value.trim() == "") {
        alert("Please fill in a valid form name!");
        return false;
    }
    else {
        //formInstance.submit();
        return true;
    }
}

显然 javascript submit() 确实提交了表单，因为页面正在重新加载，但我认识到它不再进入我的 ASP 端 btnCreateForm_Click 函数：

protected void btnCreateForm_Click(object sender, EventArgs e)
{
    System.Diagnostics.Debug.WriteLine("Test if the button has been clicked.");
}

当评论我的表单事件侦听器以及 submit() 并尝试以本机方式提交时，他毫无问题地进入了 click 函数。但是我无法在客户端检查我的表格。我错过了什么？

【问题讨论】：

标签： c# javascript asp.net

【解决方案1】：

您必须将返回添加到 OnClientClick 事件。如果函数返回 true，则回发发生。如果函数返回 false，则回发被取消。

<asp:Button ID="btnCreateForm" CssClass="submit-form button" runat="server" 
    Text="Save Form" OnClick="btnCreateForm_Click" 
        OnClientClick="return Sharpforms.checkFormEntry()" />

另外，这样做可以移除事件监听器。

【讨论】：