Interact with PHP as a server and Web front-end Interface

The interaction between PHP and Web pages is an important means to realize the interaction between PHP websites and users. This article mainly introduces the use of PHP server and Web front-end interface to interact with a certain reference value, interested in small partners can refer to.

The interaction between PHP and Web pages is an important means to realize the interaction between PHP websites and users. The scholar who wants to see this article begins by looking at the basics of PHP, because today it's a thing to learn and sell now. The basics of updating your PHP server will follow!

1. First you have to have an interface I use a simple interface of my project development to intercept and explain! Project Confidential do not * *, you know!

HTML code and interface

<! DOCTYPE html> 

</pre><pre name= "code" class= "HTML" > The above Code li part actually there are eight implementations of this interface


Because the Li code is the same, so it's not a list of people, you know?

Ok here are all understand; The following is the code to interact with Ajax is JS

Add a JS code block below


<pre name= "Code" class= "JavaScript" ><script type= "Text/javascript" > var str= ""; $.ajax ({type: "post", url: "postdemo.php", data:{"code": "201", "User": "admin"}, Success:f       Unction (data) {var result=eval ("(" +data+ ")");       alert (data);               for (Var i=0;i<result.length;i++) {if ((i+1)%4) {var str = "<li class= ' Hot_sale_li left ' >" + "<p class= ' pic ' ><a style= ' width:260px;height:172px; ' href= '" + Result[i].titleurl + "' title= ' Victoria ceramics from Then Stone series ' ></ A></p> "+" <p class= ' tit ' ><a href= ' "+ Result[i].titleurl +" ' title= ' "+ result[i].title + ">" + result[i].title + "</a></p>" + "<p class= ' price ' ><span class= ' right ' > booking: <b class= ' yd_num ' > "+ result[i].number +" </b> pieces </span><span class= ' bx_pricE ' >￥ "+ result[i]. Nprice + "</span><span class= ' Store_price ' >￥" + result[i].  Oprice + "</span></p> </li>"} else {//var str = "<li class= ' Hot_sale_li Left ' style= ' margin-right:0px ' > ' + ' <p class= ' pic ' ><a style= ' width:260px;height:172px; ' href= '  "+ Result[i].titleurl +" ' title= ' victory Ceramic Natural stone series ' ></a></p> "+" <p class= ' tit ' ><a href= ' "+ result[i] . Titleurl + "' title= '" + Result[i].title + ">" + result[i].title + "</a></p>" + "<p clas s= ' price ' ><span class= ' right ' > Reservation: <b class= ' yd_num ' > ' + result[i].number + ' </b> pieces </span> <span class= ' Bx_price ' >￥ "+ result[i]. Nprice + "</span><span class= ' Store_price ' >￥" + result[i]. Oprice + "</span></p> </li>"} $ (".Index_hot_sale #hot_sale "). Append (str); var onetitle = Result[i].title; $ (". Hot_sale_ul li:eq (" +i+ ") a"). attr ("title", Result[i].title);        $ (". Hot_sale_ul li:eq (" +i+ ") a"). attr ("title", Result[i].title); }}) </script>


<p></pre><p> several properties of Ajax above we all know what I'm talking about. Type is the way to submit altogether there are post and get two kinds I use post</p><p>. The URL is the server PHP path is to submit the data to the address, data is our submission, is to commit to the server, and then the server code is the following code:</p><p></p><p>< Pre name= "code" class= "PHP" ><?php</p>/**  * Created by Phpstorm.  * User:administrator  * date:2016-7-15  * time:17:28 * *  include "data.php"; if ($_post["code"]==201 && Amp $_post["User"]== "admin") {//  echo Json_encode (Array ("code" =>111));   echo Json_encode ($hotSale); }else{   Echo json_encode (Array ("code" =>402));   echo Json_encode ($hotSale); }

The code of the server include the PHP file in which the data is stored and the code is appended to it; I'll explain this simple server-side code.


if ($_post["code"]==201 && $_post["user"]== "admin") {//  echo Json_encode (Array ("code" =>111));   echo Json_encode ($hotSale); }

The judgment is to judge the data sent from the client side, if both code and user are correct, return the data to you if you don't wait a few.


else{   Echo json_encode (Array ("code" =>402));   echo Json_encode ($hotSale); }

This is a discussion between the developer and the server side.

Now I'm going to say the right time to return the data


<pre name= "code" class= "PHP" >echo json_encode ($hotSale);

This is the echo we all know is PHP inside the keyword, json_encode is to get our load data.php
That's it


<pre name= "code" class= "PHP" ><?php/** * Created by Phpstorm. * User:administrator * DATE:2016-7-14 * time:19:53 * */Header ("Content-type:text/html;charset=utf-8"); $hotSaleContent 1 = Array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f40088bc0491409db204dab9be3e0a3.jpg "," title "=" South home Q23025 bed (with mattress) "," Titleurl "and" = "/http Www.baixingmall.com/item/52a297380d2c004b75090030180f9be3e0a3.htm "," Nprice "=" 1980 "," Oprice "=" 1980 "," Nu Mber "=" 53 "); $hotSaleContent 2=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f4d0b610045fe09f8604dab9be3e0a3.jpg "," title "and" M-66-type Sofa "," Titleurl "and" http://www.baixingmall.com/" Item/5178d9660f230049d10847f06de39be3e0a3.htm "," nprice "=" 3600 "," Oprice "and" 8600 "," number "=" 60 "; $hotSaleContent 3=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f570129804eec0921e04dab9be3e0a3.jpg "," title "=> " and Mu Xuan HK8005 TV Cabinets "," Titleurl "and" http://www.baixingmall.com/item/526a0f8704a540492c0a3960345b9be3e0a3.htm "," Nprice "=" and "3600", "Oprice" and "8600", "number" and "60"; $hotSaleContent 4=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f5f0cb640412e0aeb104d589be3e0a3.jpg "," title "=" Yi Yuan 12f07-12e07 dining table and chairs "," Titleurl " Www.baixingmall.com/item/52fec2ee0d0a4041ca08954018d89be3e0a3.htm "," Nprice "and" + "," Oprice "and" 800 "," Number "=" 600 "); $hotSaleContent 5=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f5f0cb640412e0aeb104d589be3e0a3.jpg "," title "=" Yi Yuan 12f07-12e07 dining table and chairs "," Titleurl " Www.baixingmall.com/item/52fec2ee0d0a4041ca08954018d89be3e0a3.htm "," Nprice "and" + "," Oprice "and" 800 "," Number "=" 600 "); $hotSaleContent 6=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f5f0cb640412e0aeb104d589be3e0a3.jpg "," title "=&Gt; " Yi Yuan 12f07-12e07 dining table and chairs "," Titleurl "and" http://www.baixingmall.com/item/52fec2ee0d0a4041ca08954018d89be3e0a3.htm "," Nprice "+", "Oprice" and "+", "number" = "600"; $hotSaleContent 7=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f570129804eec0921e04dab9be3e0a3.jpg "," title "" = "and Mu Xuan HK8005 TV cabinet", "Titleurl" and "="/http Www.baixingmall.com/item/526a0f8704a540492c0a3960345b9be3e0a3.htm "," nprice "=" 3600 "," Oprice "and" 8600 "," Number "=" 60 "); $hotSaleContent 8=array ("Imgurl" and "="./People Mall-people square online shop-Zhengzhou Building Materials _ Zhengzhou Furniture _ Zhengzhou Building Materials Network _ Zhengzhou decoration Company-the lowest price, guarantee quality _files/ 56945f4d0b610045fe09f8604dab9be3e0a3.jpg "," title "and" M-66-type Sofa "," Titleurl "and" http://www.baixingmall.com/" Item/5178d9660f230049d10847f06de39be3e0a3.htm "," nprice "=" 3600 "," Oprice "and" 8600 "," number "=" 60 "; $hotSale =array ($hotSaleContent 1, $hotSaleContent 2, $hotSaleContent 3, $hotSaleContent 4, $hotSaleContent 5, $ HOTSALECONTENT6, $hotSaleContent 7, $hotSaleCoNTENT8); <p> This is where all the servers provide the data and then get that array </p><p><span style= "font-family:arial, Helvetica, Sans-serif;" > $hotSale;</p><p> and then upload to our HTML AJAX data, even if this:</span></p>


<span style= "font-family:arial, Helvetica, Sans-serif;" ></span><pre name= "code" class= "HTML" >success:function (data) {       var result=eval ("(" +data+ ")");       alert (data);

This is the function that Ajax takes when it succeeds Funcation () the data in it gets to our array, in fact he is the JSON file, just like the array format we have to convert
<span style= "font-family:arial, Helvetica, Sans-serif;" ></span><pre name= "code" class= "HTML" >var result=eval ("(" +data+ ")"); This sentence is to convert him into a truly familiar array of arrays;

And then we're going to need eight data to traverse.


<pre name= "code" class= "HTML" >for (var i=0;i<result.length;i++) {                var str = "<li class= ' Hot_sale_li Left ' > ' +               ' <p class= ' pic ' ><a style= ' width:260px;height:172px; ' href= ' "+ Result[i].titleurl +" ' title= ' Victoria Natural Stone series ' ></p> "+               " <p class= ' tit ' ><a href= ' "+ Result[i].titleurl +" ' title= ' "+ Result[i].title + ">" + result[i].title + "</a></p>" +               "<p class= ' price ' ><span class= ' right ' > booking: <b class= ' Yd_num ' > "+ result[i].number +" </b> pieces </span><span class= ' Bx_price ' >￥ "+ result[i]. Nprice + "</span><span class= ' Store_price ' >￥" + result[i]. Oprice + "</span></p> </li>"          }

Result.length is our maximum length,

After the last traversal, the output will be eight, but someone must have asked you how to load the server-transmitted array into HTML, and then explain the contents of the above var str:


<pre name= "code" class= "HTML" style= "Font-family:arial, Helvetica, Sans-serif;" >var str = "<li class= ' Hot_sale_li left ' >" +               "<p class= ' pic ' ><a style= ' width:260px;height:172px; ' Href= ' + result[i].titleurl + "' title= ' victory Ceramic Natural stone series ' ></a></p>" +               "<p class= ' tit ' ><a href= '" + result[i] . Titleurl + "' title= '" + Result[i].title + ">" + result[i].title + "</a></p>" +               "<p class= ' price ' & Gt;<span class= ' right ' > Reservations: <b class= ' yd_num ' > ' + result[i].number + ' </b> pieces </span><span class= ' Bx_price ' >￥ "+ result[i]. Nprice + "</span><span class= ' Store_price ' >￥" + result[i]. Oprice + "</span></p> </li>"          }

You can see that this is a custom array and then add a "+ +" to each row. We all understand that this is the link in JS, the data is replaced by the
result[i].xxx; I is the data that is traversed each different I get different data from the server JSON because the conversion of the array can be used to obtain;
XXX refers to each of the array keys, to get the values inside the property, the HTML is written to live!!!

The above is the whole content of this article, I hope that everyone's study has helped.