Download
1 / 14
140 likes | 154 Vues
Ajax/Xajax. Ajax. Ajax – Asynchronous Javascript And Xml By using ajax we can internally request the server and get the response without page reloading. Ajax syntax. function testFunction() { if(window.XMLHttpRequest) { Var xmlHttp=new XMLHttpRequest(); } else {
E N D
Ajax Ajax – Asynchronous Javascript And Xml By using ajax we can internally request the server and get the response without page reloading
Ajax syntax function testFunction() { if(window.XMLHttpRequest) { Var xmlHttp=new XMLHttpRequest(); } else { Var xmlHttp= new ActiveXObject("Microsoft .XMLHTTP"); } xmlHttp.onreadystatechange = function() { if(xmlHttp.readyState ==4 && xmlHttp.status ==200) { //coding for the process } } xmlHttp.open(“GET”,”url”,true); xmlHttp.send(); }
Ajax • In this sytax true - asynchronous false - synchronous • GET method is more faster then POST method in ajax. • While passing more values we should use POST method. • Here readystate 4 means success.
Ajax Example HTML codings:- <html> <body> <p><b>Start typing a user name in the input field below:</b></p> <form> User name: <input type="text" id=”userName” name=”userName”> <input type=”button” onclick=”testFunction()”> </form> <div id=”result”></div> </body> </html>
Ajax Example Script Coding:- function testFunction(){ Var xmlHttp; var userName=document.getElementById("userName").value; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlHttp=new XMLHttpRequest(); }else {// code for IE6, IE5 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlHttp.readyState==4 && xmlHttp.status==200) { document.getElementById("result").innerHTML=xmlHttp.responseText; } } xmlHttp.open("GET","display.php?userName="+userName,true); xmlHttp.send(); } Ajax Example Ajax Example
Ajax Example Script Coding:- function testFunction(){ Var xmlHttp; var userName=document.getElementById("userName").value; if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlHttp=new XMLHttpRequest(); }else {// code for IE6, IE5 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlHttp.readyState==4 && xmlHttp.status==200) { document.getElementById("result").innerHTML=xmlHttp.responseText; } } xmlHttp.open("GET","display.php?userName="+userName,true); xmlHttp.send(); } Ajax Example Ajax Example
Ajax Example PHP coding:- <?php $ipAddress=$_SERVER['REMOTE_ADDR']; $userName=$_REQUEST['userName”]; echo “Welcome “.$userName.” . Your IP address is ” .$ipAddress; ?>
Xajax • Xajax is a framework. • xajax is an open source PHP class library implementation of Ajax that gives developers the ability to create web-based Ajax applications using HTML, CSS, JavaScript, and PHP. Applications developed with xajax can asynchronously call server-side PHP functions and update content without reloading the page.
Xajax xajax is designed to be extremely easy to implement in both existing web applications as well as new projects. You can add the power of xajax to nearly any PHP script in seven easy steps: 1. Include the xajax class library: require_once("xajax_core/xajax.inc.php"); 2. Instantiate the xajax object: $xajax = new xajax(); 3. Register the names of the PHP functions you want to be able to call through xajax: $xajax->registerFunction("myFunction");
Xajax 4. Write the PHP functions you have registered and use the xajaxResponse object to return XML commands from them: function myFunction($arg) { $newContent = "Value of \$arg: ".$arg; // Instantiate the xajaxResponse object $objResponse = new xajaxResponse(); // add a command to the response to assign the innerHTML attribute of // the element with id="SomeElementId" to whatever the new content is $objResponse->assign("SomeElementId","innerHTML", $newContent); //return the xajaxResponse object return $objResponse; }
Xajax 5. Before your script sends any output, have xajax handle any requests: $xajax->processRequest(); 6. Between your tags, tell xajax to generate the necessary JavaScript: <?php $xajax->printJavascript(); ?> 7. Call the function from a JavaScript event or function in your application: <div id="SomeElementId"></div> <button onclick="xajax_myFunction('It worked!');">
Xajax The xajax hava a many commands they are below
Xajax Command for getting the form values xajax.getFormValues('formName');
