如何在PHP中使用Ajax使用警报消息框而不需要页面刷新
How to use alert message box using Ajax in PHP without page refresh?
我有我的PHP代码在这里与设计和它的后端过程。当用户输入数据时,当'createpassword'和'confirmpassword'不匹配时,使用Ajax使用提示消息的正确语法是什么?
我尝试使用JavaScript类型的警告框,但是每当用户输入密码时,它都会刷新表单。我希望它只显示一个警告框,而不刷新页面。有人有什么想法吗?
这是我的PHP设计:
<?php
$MonthArray = array(
1=>"January",
2=> "February",
3=> "March",
4=> "April",
5=> "May",
6=> "June",
7=> "July",
8=> "August",
9=> "September",
10=> "October",
11=> "November",
12=> "December",
);
?>
<!DOCTYPE html>
<html>
<head>
<title>Sign up</title>
</head>
<body>
<div id="container">
<div id="signup">
<form action="SignupProcess.php" method="POST">
<!-- Complete Name -->
<div class="Name">
<label><span style="font-weight:bold">Name</span></label>
<br>
<input type="text" name="firstname" size="15" placeholder="First" required>
<input type="text" name="lastname" size="15" placeholder="Last" required>
</div>
<br>
<!-- Username -->
<div class="Username">
<label><span style="font-weight:bold">Choose your username</span></label><br>
<input type="text" name="username" size="35" required>
</div>
<br>
<!-- Password -->
<div class="Password">
<label><span style="font-weight:bold">Create a password</span></label><br>
<input type="password" name="createpassword" size="35" required>
<br><br>
<label><span style="font-weight:bold">Confirm your password</span></label><br>
<input type="password" name="confirmpassword" size="35" required>
</div>
<br>
<!-- Birthdate -->
<div class="Birthdate">
<select name="month" required>
<option disabled selected>Month</option>
<?php foreach($MonthArray as $monthkey => $value) { ?>
<option value="<?php echo $monthkey ?>"><?php echo $value ?></option>
<?php }?>
</select>
<input type="text" name="day" placeholder="Day" size="5" required>
<select name="year" required>
<?php
foreach(range(1990, (int)date("Y")) as $year) {
echo "'t<option value='".$year."'>".$year."</option>'n'r";
rsort($year);
}
?>
</select>
</div>
<!-- Buttons -->
<div class="Buttons">
<input type="submit" id="signup" name="signupsubmit">
<input type="reset" id="reset" name="signupreset">
</div>
</form>
</div>
</div>
</body>
</html>
及其PHP进程:
<?php
include("CreateConnection.php");
// Get values from form Signup.php file
$FirstName = mysqli_real_escape_string($connect, $_POST['firstname']);
$LastName = mysqli_real_escape_string($connect, $_POST['lastname']);
$Username = mysqli_real_escape_string($connect, $_POST['username']);
$CreatePassword = mysqli_real_escape_string($connect, $_POST['createpassword']);
$ConfirmPassword = mysqli_real_escape_string($connect, $_POST['confirmpassword']);
$Month = mysqli_real_escape_string($connect, $_POST['month']);
$Day = mysqli_real_escape_string($connect, $_POST['day']);
$Year = mysqli_real_escape_string($connect, $_POST['year']);
// Removes back slashes in input
$FirstName = stripcslashes($FirstName);
$LastName = stripcslashes($LastName);
$Username = stripcslashes($Username);
$CreatePassword = stripcslashes($CreatePassword);
$ConfirmPassword = stripcslashes($ConfirmPassword);
$Month = stripcslashes($Month);
$Day = stripcslashes($Day);
$Year = stripcslashes($Year);
if($CreatePassword != $ConfirmPassword)
{
echo "<script type='text/javascript'>alert('Password does not match please check.');</script> ";
echo "<script>setTimeout('"location.href = 'Signup.php''", 0)</script>";
}
else
{
// Query Insert into tablereminders
$query = mysqli_query($connect, "INSERT INTO `tablereminders`(`username`, `password`, `firstname`, `lastname`, `Month`, `Day`, `Year`)
VALUES ('$Username','$ConfirmPassword','$FirstName','$LastName','$Month','$Day','$Year')");
}
// Error connection and query
if(mysqli_query($connect, $query))
{
echo "New record created successfully";
echo "<script>setTimeout('"location.href = 'LoginReminder.php''", 500)</script>";
}
?>
我将在这里的代码中显示一个不刷新页面的警告框。
if($CreatePassword != $ConfirmPassword)
{
echo "<script type='text/javascript'>alert('Password does not match please check.');</script> ";
echo "<script>setTimeout('"location.href = 'Signup.php''", 0)</script>";
}
我想把一个Ajax请求在我的SignupProcess.php。可以在外部调用表单函数吗?
您可以简单地使用这样的JavaScript代码来进行验证:
<?php
$MonthArray = array(
1 => "January",
2 => "February",
3 => "March",
4 => "April",
5 => "May",
6 => "June",
7 => "July",
8 => "August",
9 => "September",
10 => "October",
11 => "November",
12 => "December",
);
?>
<!DOCTYPE html>
<html>
<head>
<title>Sign up</title>
<script type="text/javascript">
function validate_form() {
var createpass = document.getElementById("createpassword").value;
var confirmpass = document.getElementById("confirmpassword").value;
if (createpass != confirmpass) {
alert("Password does not match please check.");
document.getElementById("createpassword").focus();
return false;
}
return true;
}
</script>
</head>
<body>
<div id="container">
<div id="signup">
<form action="SignupProcess.php" method="POST" onsubmit="return validate_form();">
<!-- Complete Name -->
<div class="Name">
<label><span style="font-weight:bold">Name</span></label>
<br>
<input type="text" name="firstname" size="15" placeholder="First" required>
<input type="text" name="lastname" size="15" placeholder="Last" required>
</div>
<br>
<!-- Username -->
<div class="Username">
<label><span style="font-weight:bold">Choose your username</span></label><br>
<input type="text" name="username" size="35" required>
</div>
<br>
<!-- Password -->
<div class="Password">
<label><span style="font-weight:bold">Create a password</span></label><br>
<input type="password" name="createpassword" id="createpassword" size="35" required>
<br><br>
<label><span style="font-weight:bold">Confirm your password</span></label><br>
<input type="password" name="confirmpassword" id="confirmpassword" size="35" required>
</div>
<br>
<!-- Birthdate -->
<div class="Birthdate">
<select name="month" required>
<option disabled selected>Month</option>
<?php foreach ($MonthArray as $monthkey => $value) { ?>
<option value="<?php echo $monthkey ?>"><?php echo $value ?></option>
<?php } ?>
</select>
<input type="text" name="day" placeholder="Day" size="5" required>
<select name="year" required>
<?php
foreach (range(1990, (int) date("Y")) as $year) {
echo "'t<option value='" . $year . "'>" . $year . "</option>'n'r";
rsort($year);
}
?>
</select>
</div>
<!-- Buttons -->
<div class="Buttons">
<input type="submit" id="signup" name="signupsubmit">
<input type="reset" id="reset" name="signupreset">
</div>
</form>
</div>
</div>
</body>
</html>
我已经添加了id
属性到您的两个密码字段,然后添加onsubmit="return validate_form();"
功能在您的表单标签。
可以看到在head标签中添加了一个JavaScript函数。
让我知道它是否适合你
相关文章:
- 如何在不需要单击按钮的情况下获取选项的值
- Javascript不需要的关闭行为
- 删除客户端浏览器上不需要的内容
- 不允许在字段中输入不需要的字符
- 不需要的JSON响应
- 如何使图像适合TD,而不需要包装在不同的屏幕分辨率上
- 使用一个Javascript函数提交多个表单可以在FF中工作,而不需要其他浏览器
- Angular SPA中不需要的页面刷新
- Angular不需要刷新主页,其他页面不会出现这种情况
- 我需要刷新表单,但仍然保持复选框的值不变
- 我需要在网页中创建一个帖子,而不需要使用ajax刷新页面
- 如何在不需要刷新的情况下将Kendo UI数据向导集成到页面上
- Android菜单/子菜单-菜单'Title"不需要执行任何活动…当前刷新webview
- 添加到URI/URL live,而不需要使用JavaScript/jQuery刷新页面位置
- 在同一文件中使用ajax将javascript变量传递给php函数,而不需要刷新页面
- 我想更新下拉框中的值,而不需要在ASP.Net中刷新页面
- 在一个浏览器窗口中有两个web应用程序——一个不需要刷新,而另一个需要刷新
- 使用jQuery设置高度,不需要刷新
- 如何在PHP中使用Ajax使用警报消息框而不需要页面刷新
- 是否有办法在一段时间后刷新DOM,而不需要单击或任何其他事件?