Help With Ajax POST Method

[limitphp]

The example on this forum is great and was easy to understand and work with.  I'm trying to make it work with POST

MyHttpRequest.open("post", file, true)

 

I need some help.  I'm not 100% sure what I need to modify in order to make it work.

 

here's what I have so far:

function ajaxPlaylist(target_div, file)
{
var MyHttpRequest = false;
var MyHttpLoading = '<p>Loading...</p>'; // or use an animated gif instead: var MyHttpLoading = '<img src="loading.gif" border="0" alt="running" />';
var ErrorMSG = 'Sorry - No XMLHTTP support in your browser, try firefox or internet explorer instead.';

if(window.XMLHttpRequest) // client use Firefox, Opera etc - Non Microsoft product
{
try
{
MyHttpRequest = new XMLHttpRequest();
}
catch(e)
{
MyHttpRequest = false;
}
}
else if(window.ActiveXObject) // client use Internet Explorer
{
try
{
MyHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
MyHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
MyHttpRequest = false;
}
}
}
else
{
MyHttpRequest = false;
}



if(MyHttpRequest) // browser supports httprequest
{
var random = Math.random() * Date.parse(new Date()); // make a random string to prevent caching

var file_array = file.split('.'); // prepare to check if we have a query string or a html/htm file
if(file_array[1] == 'php') // no query string, just calling a php file
{
  var query_string = '?rand=' + random;
}
else if(file_array[1] == 'htm' || file_array[1] == 'html') // calling a htm or html file
{
  var query_string = '';
}

MyHttpRequest.open("post", file, true); // <-- run the httprequest using POST

//Send the proper header information along with the POST request
MyHttpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
MyHttpRequest.setRequestHeader("Content-length", query_string.length);
MyHttpRequest.setRequestHeader("Connection", "close");
MyHttpRequest.send(query_string);



// handle the httprequest
MyHttpRequest.onreadystatechange = function ()
{
if(MyHttpRequest.readyState == 4) // done and responded
{
if (MyHttpRequest.status == 200) 
{
	document.getElementById(target_div).innerHTML = MyHttpRequest.responseText; // display result
} else {
	alert('There was a problem with the request.');
 }

}
else
{
document.getElementById(target_div).innerHTML = MyHttpLoading; // still working
}
}

}
else
{
document.getElementById(target_div).innerHTML = ErrorMSG; // the browser was unable to create a httprequest
}
}

 

 

[djbuddhi]

u don't have to write much

 

one of my project sample

 

 

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){

 

alert("Your browser broke..!Pls Try Again ...!");

return false;

}

}

}

// Create a function that will receive data sent from the server

ajaxRequest.onreadystatechange = function(){

if(ajaxRequest.readyState == 4){

var ajaxDisplay = document.getElementById('divAdd_Info');

ajaxDisplay.innerHTML = ajaxRequest.responseText;

}

}

 

 

      var password  = document.getElementById("password").value;

      var new_password = document.getElementById("new_password").value;

          var re_password  = document.getElementById("re_enter_password").value;

 

     

              if(password==""){

 

alert("Current Password Cannot be Blank..!");

document.getElementById("password").select();

document.getElementById("password").focus();

    return false;

        }

 

 

if(new_password==""){

 

alert("New Password Cannot be Blank..!");

document.getElementById("new_password").select();

document.getElementById("new_password").focus();

    return false;

        }

 

          if(re_password==""){

 

alert("Re Enter Password Cannot be Blank..!");

document.getElementById("re_enter_password").select();

document.getElementById("re_enter_password").focus();

    return false;

        }

 

 

            if(password==new_password){

 

alert("Current Passsword & New Password cannot be The Same ...!");

document.getElementById("re_enter_password").select();

document.getElementById("re_enter_password").focus();

    return false;

        } 

 

 

 

 

 

 

            if(re_password!=new_password){

 

alert("New Passsword Does not match with the Re-Enter Password ..!");

document.getElementById("re_enter_password").select();

document.getElementById("re_enter_password").focus();

    return false;

        } 

 

          /*

  if (password == "") {

  //hide_error();

  document.getElementById("nameError").style.display = "inline";

  document.getElementById("password").select();

  document.getElementById("password").focus();

      return false;

  }

 

  else

    if(new_password=="") {

  hide_error();

  document.getElementById("new_pass_Error").style.display = "inline";

  document.getElementById("new_password").select();

  document.getElementById("new_password").focus();

      return false;

  }

 

  else

    if(re_password=="") {

  // hide_error();

  document.getElementById("re_enter_password").style.display = "inline";

  document.getElementById("re_enter_password").select();

  document.getElementById("re_enter_password").focus();

      return false;

  }

else{

document.getElementById("re_enter_password").style.display = "none";

 

}

 

 

                  function  hide_error(){

    document.getElementById("nameError").style.display = "none";

document.getElementById("new_pass_Error").style.display = "none";

    document.getElementById("re_enter_password").style.display = "none";

  }

  */

 

  //  noOfSubmits++;

 

//if(noOfSubmits>1)

//{

//alert("Submission already done. Please wait ..!");

//return false;

//}

 

//else{

 

 

 

 

 

var queryString = "?current_pass="+password +"&new_password="+new_password  +"&re_enter_password="+re_password;

 

 

ajaxRequest.open("POST", "change_password_approver.php" + queryString, true);

ajaxRequest.send(null);

//}

}

 

 

[corbin]

MyHttpRequest.open("post", file, true); // <-- run the httprequest using POST

 

post should be POST.

 

 

Also, you should set the onreadystatechange pointer before calling the send() method.

 

Besides that, do you have a specific problem?  Don't feel like testing/reading your code.

 

 

Oh!

 

var query_string = '?rand=' + random;

 

With post, there is no leading ?.

 

 

 

 

djbuddhi, why in the world are you using POST to send GET data?

 

[djbuddhi]

it works with the both methods ...i used 2 use POST instead of GET