根据输入

时间:2015-12-07 11:35:35

标签: javascript php mysql ajax

我有一个有两个条目的注册表单。

我有一个显示表单的index.php文件和一个添加详细信息的外部PHP文件。我在外部PHP文件上有一个if语句,它会说明用户详细信息是否成功。

我希望成功或失败的评论显示在表单下的div中,而不刷新页面 我很遗憾地问,但我已经到处看了看,我似乎不明白该怎么做。

$username = mysql_real_escape_string( $_POST["username"] );
$password = mysql_real_escape_string( md5($_POST["password"]) );

if( empty($username) || empty($password) ) {
    echo "Username and Password Required";
    exit();
}

$sql = "INSERT INTO users VALUES('$username', '$password')" ;

if( mysql_query($sql) ) {
    echo "Inserted Successfully";
}
if(! mysql_query($sql)) {
    echo "Insertion Failed";
}

<script> 
    $(document).ready(function(e){
        $("#submit").click( function() {   
            e.preventDefault();

            var form = $('#register');

            $.ajax({
                url: 'reg.php',
                type: 'POST',
                data: form.serialize(),
            })
            .done(function(data) {
                alert(data);
                form.reset();
            })
            .fail(function() {
                console.log("error");
            });
        });
    });
</script>

<body>
    <div id="wrapper">
        <form id="reg" action="login.php" method="POST">
            <fieldset>
                <legend>Register Form</legend>
                <div>
                    <input type="text" name="username" placeholder="Enter      Username"/>
                </div>
                <div>
                    <input type="text" name="password" placeholder="Enter Password"/>
                </div>
                <input type="submit" name="submit" value="Sign-Up" onclick="load()"/>

            </fieldset> 
        </form>
        <div id="res"></div>

2 个答案:

答案 0 :(得分:2)

一个好的起点是使用不推荐使用的mysql_ *功能,最好使用mysqli或PDO。

对于我的例子,我将使用mysqli。你出错的第一个地方是使用md5,它很弱而且不是很安全,所以我会使用password_hash,这也是你使用“sanitize”的方式你的参数($username&amp; $password)可能会好很多,使用mysqli的内置函数可以帮助你解决很多问题。

请参阅下面的代码:

<?php

$username = $_POST['username']; //Set the username
$password = password_hash($_POST['password'], PASSWORD_BCRYPT); //Hash the password properly, md5 is weak!

//Set up the link
$link = mysqli_init();
$link->real_connect("hostname", "ServerUsername", "ServerPassword", "dbname");

//Prepare the query (using named params for this, i.e. :username and :password
$query = $link->prepare("INSERT INTO `users` VALUES (:username, :password);");
//Bind the username
$query->bind_param(":username", $username);
//Bind the password
$query->bind_param(":password", $password);
//Execute the query
$query->execute();
//Set the result to a variable
$query->bind_result($result);

//Check inserted or not
if ($result)
    echo "Inserted";
else
    echo "Failed to insert";

?>

使用preparebind_parambind_result会让您受益,因为您只需要一个简单的结果进行真正的||错误比较。

如果您需要进一步说明,请告诉我们:)

进行AJAX调用的更好方法是在单$.ajax({...})次调用中完成所有操作,例如:

$( document ).ready( function ()
{
    $( "#submit" ).on( "click", function ()
    {
        $.ajax( {
            url: "reg.php",
            type: "POST",
            data: form.serialize(),
            success: function ( response )
            {
                $( "#area_id" ).html( response );
            },
            beforeSend: function ()
            {
                $( "#area_id" ).html( "Loading..." );
            },
            error: function()
            {
                $( "#area_id" ).html( "Failed to load." );
            }
        } );
    } );
} );

要做的好事就是使用三元运算符进行true||false检查,即:

mysql_query($query);
echo ((mysql_affected_rows($connection) > 0) ? "Inserted" : "Failed");
//Where $connection is the connection to the DB

三元运营商就像在说

if (mysql_affected_rows($connection) > 0) 
{
    echo "inserted"; 
} 
else
{
    echo "Failed";
}

有时将它们称为简写if else语句

答案 1 :(得分:0)

我已经研究过了,发现了很多问题。

您可以做的是复制并粘贴此代码,看看与原始代码有什么不同。

<强> reg.php

<?php
//Check if the request variables are set
$username = isset($_REQUEST['username']) ? $_REQUEST['username'] : "Not Set";
$password = isset($_REQUEST['password']) ? $_REQUEST['password'] : "Not Set";
print "{$username}<br />{$password}";
//Do whatever you need to
?>

<强>的index.php

<!DOCTYPE html>
<html lang="en-gb">
<head>
    <title>Register</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script>
        $( document ).ready( function ()
        {
            $( "#submit" ).on( "click", function ()
            {
                console.log("reg.php?username=" + $( "#username" ).val() + "&password=" + $( "#password" ).val());
                $.ajax( {
                    url: "reg.php?username=" + $( "#username" ).val() + "&password=" + $( "#password" ).val(),
                    type: "GET",
                    success: function ( response )
                    {
                        $( "#res" ).html( response );
                    },
                    beforeSend: function ()
                    {
                        $( "#res" ).html( "Loading..." );
                    }
                } );
            } );
        } );
    </script>
</head>

<body>
    <div id="wrapper">
        <fieldset>
            <legend>Register form</legend>
            <div>
                <input type="text" name="username" id="username" placeholder="Username" />
            </div>
            <div>
                <input type="password" name="password" id="password" placeholder="Password" />
            </div>
            <button id="submit">Sign up</button>
        </fieldset>
    </div>
    <div id="res"></div>
</body>
</html>

你所拥有的是一个将你带到login.php的动作,这就是你重定向到另一页的原因。我删除了表单和提交代替按钮,这允许更多控制,这意味着您可以使用JavaScript来更改位置。

另外,你的部分JavaScript都是假的,现在还记得不行!所以这些已被删除和优化。