jquery发布表单到另一个php文件

时间:2012-09-12 22:41:47

标签: php jquery ajax forms post

我已经使用jquery牛奶进行验证,但不知怎的,我无法将表单传递给我的其他文件registerUser_process.php。我想我应该在javascript中传递它,但我需要一个如何在javascript中将表单发布到另一个php文件。任何人都可以帮助我吗?

 The form:

<form id="signupform" autocomplete="off" method="get" action="registerUser_process.php">
          <table id="table-3">
          <tr>
            <td class="label"><label id="lfirstname" for="firstname">First Name</label></td>
            <td class="field"><input id="firstname" name="firstname" type="text" value="" maxlength="100" /></td>
            <td class="status"></td>
          </tr>
          <tr>
            <td class="label"><label id="llastname" for="lastname">Last Name</label></td>
            <td class="field"><input id="lastname" name="lastname" type="text" value="" maxlength="100" /></td>
            <td class="status"></td>
          </tr>
          <tr>
            <td class="label"><label id="lusername" for="username">Username</label></td>
            <td class="field"><input id="username" name="username" type="text" value="" maxlength="50" /></td>
            <td class="status"></td>
          </tr>
          <tr>
            <td class="label"><label id="lpassword" for="password">Password</label></td>
            <td class="field"><input id="password" name="password" type="password" maxlength="50" value="" /></td>
            <td class="status"></td>
          </tr>
          <tr>
            <td class="label"><label id="lpassword_confirm" for="password_confirm">Confirm Password</label></td>
            <td class="field"><input id="password_confirm" name="password_confirm" type="password" maxlength="50" value="" /></td>
            <td class="status"></td>
          </tr>
          <tr>
            <td class="label"><label id="lemail" for="email">Email Address</label></td>
            <td class="field"><input id="email" name="email" type="text" value="" maxlength="100" /></td>
            <td class="status"></td>
          </tr>

          <tr>
            <td class="label">&nbsp;</td>
            <td class="field" colspan="2">
                    <input id="terms" type="checkbox" name="terms" />
                    <label id="lterms" for="terms">I have read and accept the Terms of Use.</label>
            </td>
          </tr>
          <tr>
            <td class="label"><label id="lsignupsubmit" for="signupsubmit">Signup</label></td>
            <td class="field" colspan="2">
            <input id="signupsubmit" name="signup" type="submit" value="Signup" />
            </td>
          </tr>

          </table>
      </form>

 //Javascript

<script type="text/javascript">
$(document).ready(function() {
// validate signup form on keyup and submit
var validator = $("#signupform").validate({
    rules: {
        firstname: "required",
        lastname: "required",
        username: {
            required: true,
            minlength: 2,
            remote: "checkUserAvailability.php"
        },
        password: {
            required: true,
            minlength: 5
        },
        password_confirm: {
            required: true,
            minlength: 5,
            equalTo: "#password"
        },
        email: {
            required: true,
            email: true,
            remote: "checkEmailAvailability.php"
        },
        dateformat: "required",
        terms: "required"
    },
    messages: {
        firstname: "Enter your firstname",
        lastname: "Enter your lastname",
        username: {
            required: "Enter a username",
            minlength: jQuery.format("Enter at least {0} characters"),
            remote: jQuery.format("{0} is already in use")
        },
        password: {
            required: "Provide a password",
            rangelength: jQuery.format("Enter at least {0} characters")
        },
        password_confirm: {
            required: "Repeat your password",
            minlength: jQuery.format("Enter at least {0} characters"),
            equalTo: "Enter the same password as above"
        },
        email: {
            required: "Please enter a valid email address",
            minlength: "Please enter a valid email address",
            remote: jQuery.format("{0} is already in use")
        },
        dateformat: "Choose your preferred dateformat",
        terms: " "
    },
    // the errorPlacement has to take the table layout into account
    errorPlacement: function(error, element) {
        if ( element.is(":radio") )
            error.appendTo( element.parent().next().next() );
        else if ( element.is(":checkbox") )
            error.appendTo ( element.next() );
        else
            error.appendTo( element.parent().next() );
    },
    // specifying a submitHandler prevents the default submit, good for the demo
    submitHandler: function() {

        window.location.replace("http://knowyourchampion.com?message=succes");
    },
    // set this class to error-labels to indicate valid fields
    success: function(label) {
        // set &nbsp; as text for IE
        label.html("&nbsp;").addClass("checked");
    }
});

// propose username by combining first- and lastname
$("#username").focus(function() {
    var firstname = $("#firstname").val();
    var lastname = $("#lastname").val();
    if(firstname && lastname && !this.value) {
        this.value = firstname + "." + lastname;
    }
});

});

1 个答案:

答案 0 :(得分:0)

在验证脚本的成功功能上添加ajax调用

Your ajax request with form details 
$.ajax({
    type:"POST",
    url:"registerUser_process.php",
    data:$("#signupform").serialize(),
    complete:function(data){
    // response of ajax
   console.log(data);or alert(data)
    }
});

registerUser_process.php上回显您的表单字段