How to connect the MySQL database with Ajax and get the data returned from it. Ajax gets the data returned from MySQL. Responsexml the method of outputting different data separately.

Source: Internet
Author: User

Before you start, say the online, most of the blog about this aspect or something else, on my own feelings, the first is not detailed, the second language can not be very good for beginners to understand.

The title of my blog is used three sentences, is to facilitate other people to find good;

What is the use of the method described here? Using it, you can refresh the page without flash, and get the data feedback from the database to the real-time changes back to the interface, show it! isn't it cool, indeed.

Not much nonsense, to speak, please note the comments of my code, inside detailed said!

PHP files connected to the foreground connection:

1<! DOCTYPE HTML Public"-//w3c//dtd HTML 4.01 transitional//en">234<script>5 varxmlHttp;6 //Create a XMLHttpRequest object7 8 //The following will create objects for different browsers, as well as the effect of two if statements9 /*Ten in firefox,opera,safiar,ie7.0,ie8.0 (I know that the Window object has this property One Browser, window is a property of XMLHttpRequest, and ie6.0,5.5 is not, A IE6.0 or 5.5 is not this attribute, use Window.activexobject instead.  - */ - function Createxmlhttpobject () the { -     if(window. XMLHttpRequest) -     {  -XmlHttp =NewXMLHttpRequest ();//Creating Objects +}Else if(window. ActiveXObject) -     {  +XmlHttp =NewActiveXObject ("Microsoft.XMLHTTP");//Creating Objects A     }  at     returnXmlHttp;//created successfully, returned - } -  -function Send ()//This function is used to connect with the server file in the background, it can be asp,php, I use PHP to explain - { -XmlHttp = Createxmlhttpobject ();//call the Create object function above in      -     varURL ="33.php";//here is the URL variable, used to store you, you want to connect the file path, I am relatively simple here because 33.php and I this PHP in the same directory to           +     if(xmlHttp)//interpretation, if the object is not empty, enter the following -     { theXmlhttp.onreadystatechange =callback; *         /*Register the callback function name, which can be seen as a function call, onReadyStateChange is a property of XMLHttpRequest to detect the current state $ when the state changes, the function is triggered, all, if only the function name is required, do not add parentheses*/Panax Notoginseng          -         //The following open function, as the name implies, opens, used to connect the URL file above you the         //To set connection information: +         //First parameter: Indicates how HTTP is requested, primarily using get and post A         //second parameter: The URL address that represents the request, and the Get method request parameter is also in the URL the         //The third parameter: Indicates whether the interaction is synchronous or asynchronous, and true indicates asynchronous interaction +Xmlhttp.open ("GET"Urltrue);  -          $         //The following send function, which is the method of the object itself, is not defined here as send, it is used to send commands, send what, open command $         //send data, start interacting with server side -         //synchronous mode, the Send statement executes after the server returns data -         //asynchronously, the Send statement executes immediately theXmlhttp.send (NULL);  -}Else{WuyiAlert"error, please try again! "); the         return; -     }     Wu } -  About  $  - //The callback function, which is the function you just defined, is used to get the information returned from the server file, ASP or PHP or other - function callback () - {  A     varMInt =2;//move the pixel, this part is used to verify the +     var_obj = document.getElementById ("pic"); the     var_text = document.getElementById ("TextView"); -     var_x =parseint (_obj.style.left); $     var_y =parseint (_obj.style.top); the     /*if (_x < mInt) the _y-= mInt; the else if (_y > MInt) the _x-= mInt;*/ -_obj.style.left = _x +"px"; in_obj.style.top = _y +"px"; the     //determining the state of an object is interactive completion the     if(Xmlhttp.readystate = =4)  About     //here is the state judge has 0~4, Baidu a lot of detailed, 4 representative, connected and obtained data the     { the         //determine if the HTTP interaction is successful the         if(xmlhttp.status== $) +         { -             //get the data returned by the server side the             varxmldoc =Xmlhttp.responsexml;Bayi             //here, the returned data is stored in XML format into the variable.  the             //There is also a return type returned as a string, responsetext, this can be output by subscript method, but note that the output is a character, the             //that is, a string you want will be split into several -               -              //Here's the getElementsByTagName ("Time") [0].childnodes[0].nodevalue; it's a way to output data individually using the the              //getElementsByTagName ("") is written here is the name of the tag in your linked file, and so on, [0] is also to write the              //. Childnodes[0].nodevalue; This piece is also a pass-through, meaning to get the value the_x = Xmldoc.getelementsbytagname (" Time")[0].childnodes[0].nodevalue; the_y = Xmldoc.getelementsbytagname ("inch")[0].childnodes[0].nodevalue; -_text.innerhtml ="_x="+ _x +", _y"+_y; the               the}Else{ the alert (xmlhttp.statustext);94         }            the     } the }       the 98 function Refresh () About { -     101SetInterval ("Send ()", -);//timed refresh, loop call, above the Send function. , with a time interval of 0.1 seconds. 102     103 }  104</script> the106<body onload="Refresh ()">//Call here107<div id='pic'style='position:absolute;left:380px;top:200px;'>' the'height=' the'Src='C:\Users\Administrator.PC--20130918KZN\Desktop\9.png'/><font id="TextView"></font></div>108         109          the</body>111

PHP connected in the background:

1<?PHP2 Header(' Content-type:text/xml ');3 Header("Cache-control:no-cache, Must-revalidate");4 //The above two sentences are PHP document Content-type is set to "Text/xml", PHP document is set to "No-cache" to prevent the cache5     $time=Date(' Y-m-d h:i:s ', Time());6     7     $information= "XXXX";8     9     Ten     Echo' <?xml version= ' 1.0 "encoding=" iso-8859-1 "?><person>";//there must be, no words, nothing to lose. One     Echo"<time>".$time. "</time>"; A       //here the <time> </time> tag is just (""), inside to fill in, through this way, respectively output, get different values, the same -     Echo"<in>".$information. "</in>"; -     Echo"</person>";//complete a pair with the person above the      -      -?>

Since I was tested by the output system time, after the test was successful, I saw the time.

How to connect to the MySQL database with Ajax and get the data returned from it. Ajax gets the data returned from MySQL. Responsexml the method of outputting different data separately.

Related Article

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.