What are the differece between these two forms of Ajax calls

Question

This code is from tiztag tutorial

function ajaxFunction(){
var ajaxRequest;  // The variable that makes Ajax possible!

try{
    // Opera 8.0+, Firefox, Safari
    ajaxRequest = new XMLHttpRequest();
} catch (e){
    // Internet Explorer Browsers
    try{
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){
            // Something went wrong
            alert("Your browser broke!");
            return false;
        }
    }
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
        document.myForm.time.value = ajaxRequest.responseText;
    }
}
ajaxRequest.open("GET", "serverTime.php", true);
ajaxRequest.send(null); 
}

This is another one I find throughout jQuery website:

$.ajax({
  type:"GET" // or "POST"
  url: url,
  data: data,
  success: success,
  dataType: dataType,
  error: //function
});

I've been trying to use both ways to get some sort of response from PHP file. The first example works but I also want to get the second form to work... could someone give me some guidance? In my php all i have is:

<?php
echo("Response from PHP");
?>

check this .. http://stackoverflow.com/questions/5004233/jquery-ajax-post-example — Sushanth --, Oct 03 '12 at 03:12
I'm rewriting the code from scratch and I store it on my computer, I'm using WAMP — roy9120, Oct 03 '12 at 03:21

Justin Wood · Accepted Answer · 2015-04-15T18:46:37.497

2

The difference between the two is almost nothing. jQuery just prevents you from doing the extra boiler plate code surrounding the cross browser compatibility.

The jQuery documentation should give you all the information you need.

You will need to have an url variable, and a success variable.

The url variable will be a string to the URL in which you're trying to send this information.

The success variable will be a 'callback' function that will do whatever it is you're trying to do. It will ONLY be called if your call was a success.

Always check your Javascript console to see what your errors are.

edited Apr 15 '15 at 18:46

answered Oct 03 '12 at 03:13

Justin Wood

9,941
2
33
46

If possible, could you explain what the differences are in between those 2 forms of ajax? – roy9120 Oct 03 '12 at 03:16
Just added a note to the top of my answer. – Justin Wood Oct 03 '12 at 03:16

score 0 · Answer 2 · answered Oct 03 '12 at 03:32

Try this

$.ajax({
 type:'GET' // or "POST"
 url: 'http://www.yoursite.com/yourPhpFile.php',
 data: 'some text',//Can  be multiple data using object
 success: function(data){
   alert(data);
 },
 error: function(){
   //Do something if an error is occurred
 }
});

What are the differece between these two forms of Ajax calls

2 Answers2