[英]HTML+JS send form data to PHP using POST
I'm really new to all HTML/JS/PHP but I want to create a simple login page thats connected to a database. 我真的是所有HTML / JS / PHP的新手,但是我想创建一个连接到数据库的简单登录页面。 User provide username&password, once sumbit button is clicked the webpage will change to user's information page.
用户提供用户名和密码,单击“ sumbit”按钮,网页将切换到用户的信息页面。
So far, I have my data set up and my PHP function is working fine (I tested it with POSTMAN) , however, I cannot get my HTML/JS working. 到目前为止,我有我的数据设置和我的PHP函数工作正常(我与邮差测试过),但是,我不能让我的HTML / JS工作。 I've been using the xmlhttp method to talk with PHP but failed
我一直在使用xmlhttp方法与PHP通讯,但是失败了
So, here is my html code 所以,这是我的html代码
` `
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>login page</title>
<style type ="text/css">
h3{
text-align:center;
margin-top:20px;
}
p{
text-align:center;
}
div{
text-align:center;
}
</style>
</head>
<body>
<h3>Login Page</h3>
<form name="login">
<p>username: <input id="user" type="text" name="username" /></p>
<p>password: <input id="pass" type="password" name="password" /></p>
<p><input type="button" value ="Submit" onclick="showUser(document.getElementById('user').value, document.getElementById('pass').value)" /></p>
</form>
<br><br>
<div id="Info"><b>Student Infomation Table</b></div>
<script type="text/javascript">
function showUser(user, pass) {
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200) {
document.getElementById("Info").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST","login.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("username="+user+"&password="+pass);
}
</script>
</body>
</html>
` Here is the PHP `这是PHP
<?php
/*
* Checks the login
*/
include_once '/include/post_check.php';
// change header
header('Content-Type: application/json');
//check for post
if (checkPOST("username") && checkPOST("password")) {
$user_pass = $_POST['password'];
$user_name = $_POST['username'];
if ($user_pass == "" || $user_name == "") {
$temp = array("result" => "false", "reason" => "empty fields");
echo (json_encode($temp));
die();
}
} else {
$temp = array("result" => "false", "reason" => "not enough fields");
echo (json_encode($temp));
die();
}
// connect to MySQL
$con = mysqli_connect("localhost", "root", "xxx", "xxx");
// Check connection
if (mysqli_connect_errno()) {
// Print out reason
echo "Failed to connect to MySQL: " . mysqli_connect_error();
die();
}
if($user_name == "xxx" && $user_pass =="xxx"){
// write query (teacher's account)
$query = "SELECT *
FROM STUDENT";
}
$result = mysqli_query($con, $query);
echo "<table border='2'>
<tr>
<th>ID</th>
<th>Username</th>
<th>Password</th>
</tr>";
while($row = mysqli_fetch_array($result)) {
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['username'] . "</td>";
echo "<td>" . $row['password'] . "</td>";
echo "</tr>";
}
echo "</table>";
mysqli_close($con);
?>
checkPOST() function checkPOST()函数
<?php
function checkPOST($field){
return (isset($_POST[$field]));
}
?>
the ERROR is simple one. 错误很简单。 You missed the method tag and ACTION tag in your form...without method and action tag inside FORM, you cant submit your form data.
您错过了表单中的方法标签和ACTION标签...在FORM内没有方法和操作标签的情况下,您无法提交表单数据。 so change form tag like this,
所以像这样更改表单标签,
< form name="login" method="post" action="enter php you want to submit"> <form name =“ login” method =“ post” action =“输入要提交的php”>
use this in html 在html中使用它
use this in php 在PHP中使用它
$name=$_POST ['name']; $ name = $ _ POST ['name'];
mysql_connect(your server); mysql_select_db (your database); mysql_query (insert into your database);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.