The biggest advantage of AJAX is that it doesn't jump pages when loading and deleting. Most of the web pages now choose to write with ajax, which reduces the amount of code and loads pages faster than embedding PHP code.
The following is the deletion of loaded pages and fruits written by Ajax with the database fruit table as an example. When you start writing with ajax, you'll probably still be able to compare with handmade ones. It's a good practice.
This is the fruit table.
Here's the code for the home page. First, build a PHP file main.php
1 <body> 2 3 <h2>Content loading</h2> 4 <table cellpadding="0" cellspacing="0" border="1" width="100%"> 5 <tr> 6 <td>Name of fruit</td> 7 <td>Fruit price</td> 8 <td>Fruit producing area</td> 9 <td>operation</td> 10 </tr> 11 <tbody id="tb"> 12 13 </tbody> 14 </table> 15 </body>
My choice is to display only three columns of fruit name, price and origin in the fruit table on the page. Next we will write the loading processing page and build a PHP file, jiazaiym.php.
1 <?php 2 include("DADB.class.php"); 3 $db=new DADB(); 4 $sql="select * from fruit "; 5 $arr=$db->Query($sql); 6 $str=""; 7 foreach($arr as $v) 8 { 9 $str=$str.implode("^",$v)."|"; //Use between each line“|"Connect, and you end up with one more“|" 10 } 11 $str=substr($str,0,strlen($str)-1); //Make the last one extra“|"Delete by intercepting strings 12 echo $str; 13 ?>
After loading the page code, you can write ajax formally. These are to be written in main.php.
1 <script type="text/javascript"> 2 $.ajax({ 3 url:"jiazaiym.php", 4 dataType:"TEXT", 5 success:function(data){ 6 var str = ""; 7 var hang = data.split("|"); 8 9 for(var i=0;i<hang.length;i++) 10 { 11 var lie = hang[i].split("^"); 12 str = str+"<tr><td>"+lie[1]+"</td><td>"+lie[2]+"</td><td>"+lie[3]+"</td><td><input type='button' ids='"+lie[0]+"' class='sc' value='delete'/></td></tr>" 13 14 } 15 $("#tb").html(str); 16 } 17 }) 18 </script>
Note: When writing ajax, we should pay special attention to the semicolons and commas inside. I always write commas into semicolons. The result can't be output. After checking the code correctly, I find that the commas are written incorrectly. This is a very painful thing.
After we have finished loading the page, we need to start writing deletion pages. Build a PHP file, shanchu.php, deleting pages is very simple and is similar to embedding PHP directly before.
1 <?php 2 $ids=$_POST["ids"]; 3 include("DADB.class.php"); 4 $db=new DADB(); 5 $sql="delete from fruit where ids={$ids}"; 6 if($db->Query($sql,0)) 7 { 8 echo"OK"; 9 } 10 else{ 11 echo"flase"; 12 }
Next, when I want to rewrite an ajax, I will find that it doesn't run after writing, because deleting the class es inside the page when loading is not recognized, which requires me to put deletion into the loaded Ajax while encapsulating the load into a method, which can be called when deleting.
1 <script type="text/javascript"> 2 Load(); 3 function Load() { 4 $.ajax({ 5 url: "jiazaiym.php", 6 dataType: "TEXT", 7 success: function (data) { 8 var str = ""; 9 var hang = data.split("|"); 10 11 for (var i = 0; i < hang.length; i++) { 12 var lie = hang[i].split("^"); 13 str = str + "<tr><td>" + lie[1] + "</td><td>" + lie[2] + "</td><td>" + lie[3] + "</td><td><input type='button' ids='" + lie[0] + "' class='sc' value='delete'/></td></tr>" 14 15 } 16 $("#tb").html(str); 17 //Delete page 18 $(".sc").click(function(){ 19 var ids=$(this).attr("ids"); 20 $.ajax({ 21 url: "shanchu.php", 22 data: {ids: ids}, 23 type: "POST", 24 dataType: "TEXT", 25 success: function (aa) { //Blanking 26 if (aa.trim() == "OK") { 27 alert("Delete successful"); 28 Load(); 29 } 30 else { 31 alert("Delete failed"); 32 } 33 } 34 }) 35 }) 36 } 37 }) 38 } 39 </script>
That's all right.