AJAX Polls
In this AJAX example, we will demonstrate a voting program that allows the Web page to get results without reloading.
So far, do you like PHP and Ajxa? Yes:
No:
This example consists of four elements:
HTML Form JavaScript PHP page The text file where the results are stored
HTML form
This is an HTML page. It contains a simple HTML form and a connection to a JavaScript file:
Do I like PHP and AJAX so far?
Example explanation-HTML form
As you can see, the HTML page above contains a simple HTML form with elements with two radio buttons.
The form works like this:
When the user chooses "yes" or "no", an event is triggered when the event fires, the execution of the Getvote () function around the form is named "poll". When data is returned from the Getvote () function, the returned data is substituted for the form.
Text file
The data from the voting program is stored in a text file (Poll_result.txt).
It looks like this:
0| | 0
The first number indicates "Yes" and the second number represents "No" voting.
Note: Remember to only allow your Web server to edit the text file. Do not let other people gain access, except Web server (PHP).
Javascript
The JavaScript code is stored in "poll.js" and connected to the HTML document:
var xmlhttpfunction getvote (int) {xmlhttp=getxmlhttpobject () if (xmlhttp==null) {alert ("Browser does not support HTTP Req Uest ") return} var url=" poll_vote.php "url=url+"? vote= "+inturl=url+" &sid= "+math.random () Xmlhttp.onreadystatechange=statechanged Xmlhttp.open ("GET", url,true) xmlhttp.send (NULL)} function statechanged () { if (xmlhttp.readystate==4 | | xmlhttp.readystate== "complete") { document.getElementById ("poll"). innerhtml= Xmlhttp.responsetext; }} function Getxmlhttpobject () {var objxmlhttp=nullif (window. XMLHttpRequest) {objxmlhttp=new XMLHttpRequest ()}else if (window. ActiveXObject) {objxmlhttp=new ActiveXObject ("Microsoft.XMLHTTP")}return objXmlHttp}
Example Explanation:
The statechanged () and Getxmlhttpobject functions are the same as those in the section on PHP and AJAX requests.
Getvote () function
The function executes when the user selects "yes" or "no" in the HTML form.
Defines the URL (file name) that is sent to the server to add a parameter (vote) to the URL, adding a random number to the contents of the input field in the parameter to prevent the server from using the cached file to invoke the Getxmlhttpobject function to create the XMLHTTP object, and to inform the object when triggering a variable Execute the StateChanged function with the given URL to open the XMLHTTP object to send an HTTP request to the server
PHP page
The server page called by JavaScript code is a simple php file called "poll_vote.php".
Result:
| Yes: |
' height= ' > % |
| No: |
' height= ' > % |
Example Explanation:
The selected value is coming from JavaScript and then occurs:
Get the contents of the "Poll_result.txt" file put the contents of the file into a variable, and add 1 to the selected variable to write the results of the "poll_result.txt" file output graphical voting results