说明如何使jquery、ajax和php交互以实现表单提交和其他控件。

Question

因此，正如标题所说，我需要澄清如何使交互jquery，ajax和php，以便实现表单提交和其他控件。

这是我第一次同时使用jquery、ajax和php的web体验，当然，我也面临着一些问题。

我描述了我正在尝试做的事情。

基本上，我有一个带有注册表的索引页面：

<form id="formRegistration" action="registration_success.php" method="post">
    <p id="ptxtFullName">
        <input id="txtFullName" name="txtFullName" class="textbox" placeholder="Insert you full name" type="text" />
    </p>

    <p id="pTxtEmail">
       <input id="txtEmail" name="txtEmail" class="textbox" placeholder="Insert an email" type="text" />
    </p>

    <p id="pTxtPassword">
    <input id="txtPassword" name="txtPassword" class="textbox" placeholder="Choose a password" type="password" />
    </p>

    <p id="pTxtPasswordConfirmation">
    <input id="txtPasswordConfirmation" name="txtPasswordConfirmation" class="textbox" placeholder="Confirm your password" type="password" />
    </p>

    <p id="pBtnRegistration">
    <input id="btnRegistration" type="submit" value="Register!" />
    </p>
</form>

然后，我有一个jquery文件，它执行所有的输入验证工作(如果输入正确或不正确，会产生一些影响，诸如此类的事情)，如果验证进行得很顺利，就执行一个ajax调用。这只是一个例子，我不会发布整个文件，因为它相当大：

jQuery(document).ready(function($) {
$(function() {

            var $fullName = $("input[name='txtFullName']");
            var $email = $("input[name='txtEmail']");
            var $password = $("input[name='txtPassword']");
            var $passwordConfirmation = $("input[name='txtPasswordConfirmation']");

    $("#btnRegistration").click(function() {
        //Validation controls and effects.
    });

    return true;

    });

    $.ajax({
            type : "POST",
            url : "process_registration.php",
            data : "fullName", "email", "password",
            dataType : "HTML",
            success : function() {
                alert("Ok");
            },
            error : function() {
                alert("Error");
            }
        });

});

请注意，jquery文件，当我添加ajax调用时，它停止工作，而如果我不添加ajax调用，它将完美地工作。

然后，下面是我的名为process_registration.php的php文件，该文件用于控制电子邮件是否已在使用中，然后将经过验证的输入数据插入到MySQL数据库中：

<?php

需要'db_connection.php'；

$fullName = isset($_POST["fullName"]);
$email = isset($_POST["email"]);
$password = isset($_POST['password']);

$sql = mysql_query("SELECT * FROM utente WHERE mail = '$email'") or die("Email already in use");

$num_rows = mysql_num_rows($sql);

if ($num_rows == 0) 
{
    $password_md5 = md5($password);

    mysql_query("INSERT INTO user (Full_Name , Email, Password) VALUES
               ('$fullName', '$email', '$password_md5')") OR DIE(mysql_error());
}

这就是全部。

显然，它不起作用。

也许我在这件事上采用了完全错误的方法？

提前感谢您的好意和您的回答。

Answer 1

尝试使用以下命令：

jQuery(document).ready(function($) {
    $('#formRegistration').submit(function() {
        e.preventDefault();

        // Perform form validation here and return from this function
        // if you do not want to submit the form.

        $.ajax({
            type : "POST",
            url : "process_registration.php",
            data : $(this).serialize(),
            dataType : 'html',
            success : function() {
                alert("Ok");
            },
            error : function() {
               alert("Error");
            }
        });
    });
});

这将注册一个事件处理程序，该事件处理程序在表单将要提交时被调用。对e.preventDefault()的调用阻止了常规表单提交。然后处理程序通过ajax发布表单。

您必须更改输入元素的名称，因为它们需要与您的PHP代码正在查找的名称相匹配(例如，将"txtFullName“更改为"fullName")。

Answer 2

ajax调用中的data属性应该是一个对象。

data : {
    "fullName" : fullName,
    "email" : email
}