繁体   English   中英

单击按钮时阻止表单提交

[英]preventing form submit when button clicked

我在表单中有一个按钮。 问题是当我单击它时,它不执行服务器端功能。 在执行服务器功能和客户端验证时,是否可以防止表单提交?

提前致谢。

html(在表单内)

  <button class="submit" runat="server" id="v4"  onserverclick="v4_Click" >Validate</button>

jQuery的

 $('#v4').click(function (event) {
             if (validation()) {
                 slideToStep(5);
             }
             return false;
         });

C#

protected void v4_Click(object sender, System.EventArgs e)
        {
            System.Diagnostics.Debug.Write("test");
        }

我相信你能实现你想要什么,通过结合event.preventDefault()submit表单的事件,而不是click按钮的事件。

  1. 为您的按钮设置一个onclick ,以调用提交表单的函数。

    <button class="submit" id="v4" onclick="SubmitForm();" runat="server" onserverclick="v4_Click" >Validate</button>

  2. 设置SubmitForm()函数以提交表单,然后将函数绑定到您的Submit事件:

function SubmitForm() {
    $('#form1').submit();
}

$(function () {
    $('#form1').submit(function (event) {
        if (validation()) {
            slideToStep(5);
        }
        else
        {
            //Validation Failed, prevent form from submitting.
            event.preventDefault();
        }
    });
});

Is it possible to prevent form submission是的,您可以在jquery上单击按钮简单地编写e.preventDefault()/Return false()

但是再次While using server side function时我没有得到这个

问题出在您的javascript代码中,在您的情况下,始终调用return false ,而仅应在验证失败时调用它:

$('#v4').click(function (event) {
     if (validation()) {
         slideToStep(5);
     } else{
         return false;
     }
});

编辑:

基本上,如果要调用button_click事件,则需要提交表单,在这种情况下,我将使用WebMethod来使用ajax调用服务器端验证功能。 像这样:

C#:

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static string Validate(string params)
{
    // your validations
    return "Received : " + params;
}

jQuery的:

$(document).ready(function() {
  $("#v4").click(function() {
     $.ajax({
      type: "POST",
      url: "Default.aspx/Validate",
      data: "{params: 5 }",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(msg) {
         alert(msg.d);
      }
});

选择:

您还可以使用customValidator,ASP将为您完成所有jquery的工作。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM