Rumah > Artikel > pembangunan bahagian belakang > Cara menggunakan teknologi PHP dan AJAX untuk melaksanakan penambahan, pemadaman, pengubahsuaian dan fungsi carian
Cara menggunakan teknologi PHP dan AJAX untuk melaksanakan penambahan, pemadaman, pengubahsuaian dan fungsi carian
- PHPzasal
- 2023-04-18 10:19:00676semak imbas
Dalam beberapa tahun kebelakangan ini, dengan perkembangan pesat dan popularisasi teknologi Web, semakin banyak laman web dan aplikasi telah menggunakan teknologi AJAX untuk mencapai pengalaman interaktif yang lebih dinamik dan pintar. Dalam pengaturcaraan WEB, PHP ialah bahasa pengaturcaraan sebelah pelayan yang sangat biasa digunakan. Oleh itu, menggabungkan teknologi PHP dan AJAX untuk melaksanakan operasi penambahan, pemadaman, pengubahsuaian dan pertanyaan telah menjadi pilihan pertama banyak pembangun WEB. Artikel ini akan memperkenalkan cara menggunakan teknologi PHP dan AJAX untuk melaksanakan fungsi tambah, padam, ubah suai dan semak.
- Pengetahuan asas PHP
Sebelum memperkenalkan teknologi PHP dan AJAX, kita perlu memahami beberapa sintaks asas dan kaedah manipulasi data PHP:
1.1 Sintaks asas PHP
PHP ialah bahasa skrip bahagian pelayan yang dinamik dan ditafsirkan termasuk:
1 Kod PHP bermula dengan .
2. Penyataan PHP berakhir dengan koma bertitik “;”.
3. Pembolehubah PHP bermula dengan simbol $, seperti $name.
4. Terdapat dua cara untuk mengulas dalam PHP: // untuk ulasan satu baris dan /.../ untuk ulasan berbilang baris.
Berikut ialah contoh sintaks PHP:
<?php
// 这是单行注释
/*
这是多行注释
*/
$name = "Tom"; // 定义一个变量
echo "Hello, ".$name."!"; // 输出变量
?>
1.2 operasi data PHP
PHP boleh berinteraksi dengan pelbagai pangkalan data, seperti MySQL, Oracle, SQL Pelayan, dsb. Dalam PHP, pangkalan data MySQL digunakan terutamanya, dan interaksi dengan pangkalan data MySQL dicapai melalui perpustakaan sambungan seperti MySQLi atau PDO. Berikut ialah operasi asas pangkalan data PHP dan MySQL:
1 Sambung ke pangkalan data
$con = mysqli_connect("localhost","username","password","dbname");
2 Jalankan penyata SQL dan kembalikan set hasil
$sql = "SELECT * FROM Users"; $result = mysqli_query($con,$sql);
3. Baca Dapatkan data dalam set hasil
while($row = mysqli_fetch_array($result))
{
echo $row['UserName'];
echo $row['Password'];
echo $row['Email'];
}
4. Tutup sambungan pangkalan data
mysqli_close($con);
- Gunakan AJAX untuk melaksanakan penambahan, pemadaman, pengubahsuaian dan pertanyaan
Dalam artikel ini, Kami akan mengambil sistem pengurusan pengguna sebagai contoh untuk memperkenalkan cara menggunakan AJAX dan PHP untuk melaksanakan empat fungsi berikut:
1 🎜>
2. Tambah pengguna baharu 3 , Ubah suai maklumat pengguna4 Padam maklumat pengguna2.1 Tanya maklumat penggunaKami dahulu melaksanakan fungsi menanya maklumat pengguna, yang mengandungi dua bahagian: halaman hadapan dan skrip PHP Bahagian Belakang. 2.1.1 Halaman hadapanKami menggunakan HTML dan AJAX untuk melaksanakan halaman hadapan untuk menanya maklumat pengguna:<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>用户管理系统 - 查询</title>
</head>
<body>
<h1>用户管理系统 - 查询</h1>
<table border="1" cellpadding="10">
<thead>
<tr>
<th>ID</th>
<th>用户名</th>
<th>密码</th>
<th>邮箱</th>
</tr>
</thead>
<tbody id="user_table">
</tbody>
</table>
<script>
$(document).ready(function(){
$.ajax({
url:'query_user.php',
type:'get',
dataType:'json',
success:function(data){
if(data.code==0){
var users = data.data;
var tr = '';
for(var i=0;i<users.length;i++){
tr += '<tr>'
+'<td>'+users[i].id+'</td>'
+'<td>'+users[i].username+'</td>'
+'<td>'+users[i].password+'</td>'
+'<td>'+users[i].email+'</td>'
+'</tr>';
}
$('#user_table').append(tr);
}
},
error:function(){
alert('查询失败！');
}
});
});
</script>
</body>
</html>Dalam kod di atas, kami menggunakan perpustakaan jQuery untuk memulakan permintaan AJAX, mengakses skrip query_user.php, dan memberikan data format JSON yang dikembalikan ke dalam halaman. 2.1.2 Skrip PHP belakang Berikut ialah kod skrip query_user.php:
<?php
$con = mysqli_connect("localhost","username","password","dbname");
$sql = "SELECT * FROM users";
$result = mysqli_query($con,$sql);
$users = array();
if(mysqli_num_rows($result)>0){
while($row = mysqli_fetch_assoc($result)){
$users[] = $row;
}
$response = array(
'code'=>0,
'message'=>'查询成功',
'data'=>$users
);
}else{
$response = array(
'code'=>-1,
'message'=>'查询失败'
);
}
echo json_encode($response);
mysqli_close($con);
?>Dalam kod, kami mengembalikan hasil pertanyaan dalam Format JSON Jika pertanyaan Jika berjaya, nilai medan kod ialah 0, dan medan data ialah tatasusunan hasil pertanyaan jika tidak, medan kod ialah -1, dan medan mesej ialah maklumat segera untuk kegagalan pertanyaan. 2.2 Tambah pengguna baharu Apabila melaksanakan fungsi tambah pengguna baharu, kami perlu menghantar data pengguna ke skrip PHP, jadi kami menggunakan kaedah POST, dan JavaScript dan PHP lulus parameter Pas pembolehubah super global. $_POST
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>用户管理系统 - 添加</title>
</head>
<body>
<h1>用户管理系统 - 添加</h1>
<form id="add_form">
<label>用户名：</label>
<input type="text" name="username"><br>
<label>密码：</label>
<input type="password" name="password"><br>
<label>邮箱：</label>
<input type="email" name="email"><br>
<input type="submit" value="添加">
</form>
<script>
$(function(){
$('#add_form').submit(function(event){
event.preventDefault();
var data = $(this).serialize();
$.ajax({
url:'add_user.php',
type:'post',
dataType:'json',
data:data,
success:function(data){
if(data.code==0){
alert('添加成功！');
}else{
alert('添加失败！');
}
},
error:function(){
alert('添加失败！');
}
});
});
});
</script>
</body>
</html>Dalam kod di atas, kami mentakrifkan borang dan tetapkan setiap item dalam borang Nama dan jenis kotak input, dengan butang dikhaskan untuk menghantar borang. Dalam acara klik butang, kami menggunakan kaedah jQuery untuk merangkum data borang ke dalam rentetan dan menyerahkannya kepada skrip PHP. serialize()
<?php
if($_SERVER['REQUEST_METHOD']=='POST'){
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
$con = mysqli_connect("localhost","username","password","dbname");
$sql = "INSERT INTO users (username,password,email) VALUES ('$username','$password','$email')";
if(mysqli_query($con,$sql)){
$response = array(
'code'=>0,
'message'=>'添加成功'
);
}else{
$response = array(
'code'=>-1,
'message'=>'添加失败'
);
}
echo json_encode($response);
mysqli_close($con);
}
?>Dalam kod, kami menggunakan untuk mendapatkan data borang penghantaran halaman hadapan dan gunakan perpustakaan sambungan mysqli untuk memasukkan data ke dalam pangkalan data MySQL. $_POST
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>用户管理系统 - 修改</title>
</head>
<body>
<h1>用户管理系统 - 修改</h1>
<form id="edit_form">
<input type="hidden" name="id" value="">
<label>用户名：</label>
<input type="text" name="username" value=""><br>
<label>密码：</label>
<input type="password" name="password" value=""><br>
<label>邮箱：</label>
<input type="email" name="email" value=""><br>
<input type="submit" value="保存">
</form>
<script>
function queryUser(id){
$.ajax({
url:'query_user.php',
type:'get',
dataType:'json',
data:{id:id},
success:function(data){
if(data.code==0){
var user = data.data[0];
$('input[name="id"]').val(user.id);
$('input[name="username"]').val(user.username);
$('input[name="password"]').val(user.password);
$('input[name="email"]').val(user.email);
}else{
alert('查询失败！');
}
},
error:function(){
alert('查询失败！');
}
});
}
$(function(){
var id = parseInt(location.search.substring(4));
if(isNaN(id)){
alert('用户ID错误！');
}else{
queryUser(id);
$('#edit_form').submit(function(event){
event.preventDefault();
var data = $(this).serialize();
$.ajax({
url:'edit_user.php',
type:'post',
dataType:'json',
data:data,
success:function(data){
if(data.code==0){
alert('保存成功！');
}else{
alert('保存失败！');
}
},
error:function(){
alert('保存失败！');
}
});
});
}
});
</script>
</body>
</html>Dalam kod di atas, kami mentakrifkan yang tersembunyi medan dalam borang untuk Simpan ID pengguna, dapatkan nilai ID pengguna melalui parameter pertanyaan, hantar permintaan AJAX untuk mendapatkan maklumat pengguna, dan paparkan maklumat dalam borang. Dalam acara penyerahan borang, kami menyerahkan maklumat yang diubah suai pengguna kepada skrip PHP untuk dikemas kini melalui kaedah AJAX. 2.3.2 Skrip PHP belakang Berikut ialah kod skrip edit_user.php:
<?php
if($_SERVER['REQUEST_METHOD']=='POST'){
$id = $_POST['id'];
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
$con = mysqli_connect("localhost","username","password","dbname");
$sql = "UPDATE users SET username='$username',password='$password',email='$email' WHERE id=$id";
if(mysqli_query($con,$sql)){
$response = array(
'code'=>0,
'message'=>'保存成功'
);
}else{
$response = array(
'code'=>-1,
'message'=>'保存失败'
);
}
echo json_encode($response);
mysqli_close($con);
}
?>Dalam kod, kami masih menggunakan untuk mendapatkan data borang penghantaran halaman hadapan, dan gunakan perpustakaan sambungan mysqli untuk mengemas kini data pengguna dalam pangkalan data. $_POST
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<title>用户管理系统 - 删除</title>
</head>
<body>
<h1>用户管理系统 - 删除</h1>
<table border="1" cellpadding="10">
<thead>
<tr>
<th>ID</th>
<th>用户名</th>
<th>密码</th>
<th>邮箱</th>
<th>操作</th>
</tr>
</thead>
<tbody id="user_table">
</tbody>
</table>
<script>
$(function(){
$.ajax({
url:'query_user.php',
type:'get',
dataType:'json',
success:function(data){
if(data.code==0){
var users = data.data;
var tr = '';
for(var i=0;i<users.length;i++){
tr += '<tr>'
+'<td>'+users[i].id+'</td>'
+'<td>'+users[i].username+'</td>'
+'<td>'+users[i].password+'</td>'
+'<td>'+users[i].email+'</td>'
+'<td><a href="javascript:void(0);" onclick="deleteUser('+users[i].id+');">删除</a></td>'
+'</tr>';
}
$('#user_table').append(tr);
}
},
error:function(){
alert('查询失败！');
}
});
});
function deleteUser(id){
if(confirm('确定要删除该用户吗？')){
$.ajax({
url:'delete_user.php',
type:'post',
dataType:'json',
data:{id:id},
success:function(data){
if(data.code==0){
alert('删除成功！');
location.reload();
}else{
alert('删除失败！');
}
},
error:function(){
alert('删除失败！');
}
});
}
}
</script>
</body>
</html>Dalam kod di atas, kami menggunakan AJAX untuk meminta semua maklumat pengguna dalam pangkalan data, dan diberikan ke dalam jadual. Butang "Padam" ditambahkan pada setiap baris jadual Apabila diklik, permintaan AJAX dihantar untuk memadam maklumat pengguna dalam baris semasa. 2.4.2 Skrip PHP belakang Berikut ialah kod skrip delete_user.php:
<?php
if($_SERVER['REQUEST_METHOD']=='POST'){
$id = $_POST['id'];
$con = mysqli_connect("localhost","username","password","dbname");
$sql = "DELETE FROM users WHERE id=$id";
if(mysqli_query($con,$sql)){
$response = array(
'code'=>0,
'message'=>'删除成功'
);
}else{
$response = array(
'code'=>-1,
'message'=>'删除失败'
);
}
echo json_encode($response);
mysqli_close($con);
}
?>Dalam kod, kami memperoleh data yang diluluskan oleh halaman hadapan melalui ID Pengguna, dan gunakan perpustakaan sambungan mysqli untuk memadamkan data pengguna yang sepadan daripada pangkalan data. $_POST
- Ringkasan
Artikel ini memperkenalkan cara menggunakan teknologi PHP dan AJAX untuk melaksanakan fungsi tambah, padam, ubah suai dan semak Ia menghuraikan pelaksanaan dari aspek sintaks asas PHP , operasi data MySQL, proses penghantaran permintaan AJAX, dsb., dan menyediakan halaman hujung hadapan dan skrip PHP hujung belakang yang menyokong. Mempelajari dan menguasai pengetahuan dalam artikel ini boleh membantu pembangun melengkapkan pembangunan aplikasi berasaskan WEB dengan lebih cekap.
Atas ialah kandungan terperinci Cara menggunakan teknologi PHP dan AJAX untuk melaksanakan penambahan, pemadaman, pengubahsuaian dan fungsi carian. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!