使用ajax而不是action提交表单

submit form with ajax rather than action

本文关键字:action 提交 表单 ajax 使用      更新时间:2023-09-26

只是试图用ajax而不是操作来提交表单,但仍然没有成功。php脚本可以工作,并且一直在通过提交操作进行测试。

到目前为止,我看了一些例子,阅读了文档,问了so一些问题,但我仍然没有答案。我需要帮助,我本应该在两周前测试这个用例的。

当我提交页面时,它看起来像是刷新了,但什么也没发生。用户帐户未插入到数据库中,也不会出现任何警告框。有人看到哪里出了问题吗?

javascript如下所示:

    $(document).ready(function()
{
$.validator.addMethod("uniqueuser", function(username){
    var response
    $.ajax({
        type: "POST",
        url: "check_username.php",
        data: "username=" + username,
        success: function(server_response){

                if(server_response == '0'){
                    response = true;
                }
                else if(server_response == '1'){
                    response = false;
                }
        }
    });
    return response;
}, "Username is not available");

$("#createaccount).validate({
    debug: false,
    rules:{
        fname:{
            required: true
        }
        surname:{
            required: true
        }
        email:{
            email:true,
            required: true
        }
        location:{
            required:true
        }
        username:{
            minlength: 6,
            required:true,
            uniqueuser:true
        }
        password:{
            required:true,
            minlength: 6
        }
        re_password:{
            required:true,
            equalTo: "#password"
        }
    }

    submitHandler: function(form){
        $.ajax({
            type: 'POST',
            url: 'createaccount2.php',
            data: $("#createaccount").serialize(),
            success: function(response){
                if(response == "1"){
                    alert("That username is already taken!");
                }
                else if(response == "2"){
                    alert("An account is already registered to that email address");
                }
                else if(response == "3"){
                    alert("Your account has been created!");
                }
                else if(response == "4"){
                    alert("Something went wrong, your account could not be created");
                }
            }
        });

    });
});
});

有关验证器的信息:http://docs.jquery.com/Plugins/Validation

脚本中有很多问题。所有这些显然都与您正在使用的验证器插件有关。一种是异步呼叫。

当你使用$.validator(我不知道这个插件,你能添加引用吗?)时,你会尝试使用设置为ASYNC的return response;。(AJAX得到服务器的响应之后)。这就是AJAX具有回调函数的原因,因为您不知道什么时候会设置That。

发生了什么return在AJAX get完成之前执行,并修改变量(但范围很好)。

修复您需要深入研究验证程序插件,看看它是否支持异步验证。

否则,您将需要设置自己的脚本验证。

如何将表单提交与表单关联?你需要在Form onSubmit事件中做一些事情,对吗?或者使用Submit事件处理程序?

<form id="target" action="destination.html">

就像这个

$('#target').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});

更多信息:http://api.jquery.com/submit/

    <form id="target" onSubmit="return false;">