ユーザーをサインアップし、ユーザーをデータベースに保存し、ユーザー情報を div に表示する SPA を作成しようとしています。PHP/MYSQL と jQuery を使用しています。問題のウォークスルーは次のとおりです。
以下のすべてのコードが機能しました。これを最初に投稿してから、jQuery を使用しようとするとどうなるかを説明します。
index.php
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<title>it IT</title>
<link rel="stylesheet" type="text/css" href="application.css" />
<script src="jquery.js"></script>
<script src="application.js"></script>
<script type="text/javascript" src="ejs_production.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<h1>it IT</h1>
<div id="signup">
<form id="signupform" method="post" action="insert_ac.php">
Username: <input type="text" name="username" id="username"><br>
Password: <input type="password" name="pw" id="pw"><br>
Email: <input type="text" name="email" id="email"><br>
<input type="submit" name="Submit" value="Submit">
</form>
</div>
<div id="signin"></div>
<div id="showuser">
<h2>Username - Email</h2>
<ul id="listuser"></ul>
</div>
</body>
</html>
insert_ac.php
<?php
$host="localhost"; // Host name
$uname="root"; // Mysql username
$password="bonjour3"; // Mysql password
$db_name="itit"; // Database name
$tbl_name="users"; // Table name
// Connect to server and select database.
$link = mysqli_connect("$host", "$uname", "$password", "$db_name")or die("cannot connect");
// Get values from form
$username=$_POST['username'];
$pw=$_POST['pw'];
$email=$_POST['email'];
// Insert data into mysql
$sql="INSERT INTO $tbl_name(username, password, email)VALUES('$username', '$pw', '$email')";
$result=mysqli_query($link, $sql);
// if successfully insert data into database, displays message "Successful".
if($result){
echo "Successful";
echo "<BR>";
echo "<a href='index.php'>Back to main page</a>";
}
else {
echo "ERROR";
}
?>
<?php
// close connection
mysqli_close($link);
?>
私が言ったように、上記のコードはすべて正常に動作します - ユーザーが作成され、エコーは if/else ステートメント内で正常に動作します。
ここで、.php ファイルを (基本的にはテンプレートとして) "listuser" div に挿入したいと考えています。このテンプレートは、ユーザーの電子メールとユーザー名を表示する必要があります。
テンプレートは次のとおりです。
テンプレート/showuser.php
<?php
$host="localhost"; // Host name
$uname="root"; // Mysql username
$password="bonjour3"; // Mysql password
$db_name="itit"; // Database name
$tbl_name="users"; // Table name
// Connect to server and select database.
$link = mysqli_connect("$host", "$uname", "$password", "$db_name")or die("cannot connect");
$lastuser="SELECT * FROM users ORDER BY autoIncrementColumn DESC LIMIT 1";
$result = mysqli_query($link,$lastuser) or die (mysql_error());
$row = $result->fetch_assoc();
?>
<li><? echo $row['username'] ?> - <? echo $row['email'] ?></li>
<?php
// close connection
mysqli_close($link);
?>
次に、このコード (insert_ac.php から) をコメントアウトします。
// if successfully insert data into database, displays message "Successful".
if($result){
echo "Successful";
echo "<BR>";
echo "<a href='index.php'>Back to main page</a>";
}
else {
echo "ERROR";
}
これは、私がコメントアウトしたものを置き換えるjQueryです。
アプリケーション.js
$(document).ready(function() {
$("#signupform").submit(function(e) {
e.preventDefault();
$("#listuser").load("templates/showuser.php")
$("#signupform").remove();
});
});
insert_ac.php コードをコメントアウトして jQuery を実装すると、テンプレートは listuser div に表示されますが、ユーザーは保存されなくなり、テンプレートには何も表示されません (「-」文字を除く)。jQueryを実装すると、ユーザーが保存されなくなった理由を誰かが知っていますか?
アップデート
いくつかの提案により、コードをより安全にしようとしました。これが私が変更したものです...動作しているようです-ユーザーが保存され、printf()ステートメントが表示されます。
insert_ac.php
<?php
$host="localhost"; // Host name
$uname="root"; // Mysql username
$password="bonjour3"; // Mysql password
$db_name="itit"; // Database name
$tbl_name="users"; // Table name
// Connect to server and select database.
$link = mysqli_connect("$host", "$uname", "$password", "$db_name")or die("cannot connect");
// Get values from form
$username=$_POST['username'];
$pw=$_POST['pw'];
$email=$_POST['email'];
// Insert data into mysql
$sql= $link->prepare("INSERT INTO $tbl_name(username, password, email)VALUES(?,?,?)");
$sql->bind_param('sss', $username, $pw, $email);
$sql->execute();
printf("%d Row inserted.\n", mysqli_stmt_affected_rows($sql));
mysqli_stmt_close($sql);
// if successfully insert data into database, displays message "Successful".
//if($result){
//echo "Successful";
//echo "<BR>";
//echo "<a href='index.php'>Back to main page</a>";
//}
//else {
//echo "ERROR";
//}
//?>
<?php
// close connection
mysqli_close($link);
?>
これはより安全ですか/私がすべきことは何ですか?