PHP and AJAX Responsexml instances

Source: Internet
Author: User
Tags html form
AJAX can be used to return database information in XML.

AJAX Database to XML instance (test Note: the instance feature is not implemented)

In the following AJAX example, we will show how the Web page reads information from the MySQL database, transforms the data into an XML document, and uses the document to display the information in different places.

This example is very similar to the example of "PHP AJAX Database" in the previous section, but there is a big difference: In this case, we get the data in XML form from the PHP page using the Responsexml function.

Receiving an XML document as a response gives us the ability to update multiple locations of the page, rather than just receiving a PHP output and displaying it.

In this example, we will use the information received from the database to update multiple elements.

Select a name in the drop-down list select a user:peter Griffin Lois Griffin Joseph Swanson Glenn Quagmire

This column consists of four elements:

MySQL database Simple HTML form JavaScript PHP page

Database

The database that will be used in this example looks something like this:

ID FirstName LastName Age hometown Job
1 Peter Griffin 41 Quahog Brewery
2 Lois Griffin 40 Newport Piano Teacher
3 Joseph Swanson 39 Quahog Police Officer
4 Glenn Quagmire 41 Quahog Pilot

HTML form

The example above contains a simple HTML form and a link to JavaScript:

Example explanation-an HTML form HTML form is a drop-down list with the value of the Name property of "users", and the value of the option corresponds to the ID field of the database. There are several Elements, which are used as placeholders for the different values we receive when the user chooses a specific option, the function "Showuser ()" executes. Execution of the function is triggered by the "onchange" event

In other words, whenever the user changes the value in the drop-down list, the function Showuser () executes and outputs the result in the specified element.

Javascript

This is the JavaScript code stored in the file "Responsexml.js":

var xmlhttpfunction showuser (str) {xmlhttp=getxmlhttpobject () if (xmlhttp==null) {alert ("Browser does not support HT TP Request ") return} var url=" responsexml.php "url=url+"? q= "+str url=url+" &sid= "+math.random () Xmlhttp.onreadysta Techange=statechanged Xmlhttp.open ("GET", url,true) xmlhttp.send (null)}function statechanged () {if ( xmlhttp.readystate==4 | | xmlhttp.readystate== "complete") {Xmldoc=xmlhttp.responsexml; document.getElementById ("FirstName"). innerhtml= Xmldoc.getelementsbytagname ("FirstName") [0].childnodes[0].nodevalue; document.getElementById ("LastName"). Innerhtml= xmldoc.getelementsbytagname ("LastName") [0].childnodes[0]. NodeValue; document.getElementById ("Job"). Innerhtml= xmldoc.getelementsbytagname ("job") [0].childnodes[0].nodevalue; document.getElementById ("Age_text"). Innerhtml= "Age:"; document.getElementById ("Age"). Innerhtml= xmldoc.getelementsbytagname ("Age") [0].childnodes[0].nodevalue; document.getElementById ("Hometown_text"). Innerhtml= "
From: "; document.getElementById ("Hometown"). Innerhtml= xmldoc.getelementsbytagname ("Hometown") [0].childNodes[0]. NodeValue; }}function Getxmlhttpobject () {var objxmlhttp=null if (window). XMLHttpRequest) {objxmlhttp=new XMLHttpRequest ()} else if (window. ActiveXObject) {objxmlhttp=new ActiveXObject ("Microsoft.XMLHTTP")} Return objXmlHttp}
Example Explanation:

The Showuser () and Getxmlhttpobject functions are the same as those in the section on PHP and AJAX MySQL db instances. You can refer to the relevant explanations.

StateChanged () function

If you select an item in the drop-down list, the function executes:

By using the Responsexml function, the "xmldoc" variable is defined as an XML document that retrieves data from the XML document, placing them in the correct "span" element

PHP page

This server page, called by JavaScript, is a simple php file called "responsexml.php".

This page is written by PHP and uses the MySQL database.

The code runs a SQL query against the database and returns the results as an XML document:

 
   
 
   
    
  '; while ($row = Mysql_fetch_array ($result)) {echo "
  
    
     
   ". $row [' FirstName ']. "
  
    "; echo "
  
    
     
   ". $row [' LastName ']. "
  
    "; echo "". $row [' Age ']. ""; echo "
  
    
     
   ". $row [' Hometown ']. "
  
    "; echo "
  
    
     
   ". $row [' Job ']. "
  
    "; }echo "
 
   "; mysql_close ($con);? >
Example Explanation:

When a query is delivered to a PHP page from JavaScript, it happens:

PHP document Content-type is set to "Text/xml" PHP document is set to "No-cache" to prevent the cache with HTML page data sent to set $q variable PHP open connection with the MySQL server found with the specified ID " User "outputs data in an XML document
  • Contact Us

    The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

    If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.