Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

AJAX / PHP - Pass variables using POST?

Posted on 2012-03-28
9
Medium Priority
?
809 Views
Last Modified: 2012-03-28
I currently have the following piece of code working - passing a GET request to another page, and that second page can pick up the variable:

Page 1 AJAX code:

<script type="text/javascript">
function StockCodeInfo(str)
 {
 var xmlhttp;
 if (str=="")
   {
   document.getElementById("StockCodeInfo").innerHTML="";
   return;
   }
 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("StockCodeInfo").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","ajax/stockcodeinfo.php?q="+str,true);
 xmlhttp.send();
 }
 
 </script>




Page 2 - , get the variable and display it:

<?php
 $q=$_GET["q"];
 echo $q;
 ?>

How do I do that exact same thing using the post method - i'm failing to see how the variables get passed through?

I've had a quick google and i can see that the following lines need changing:

 xmlhttp.open("GET","ajax/stockcodeinfo.php?q="+str,true);
 xmlhttp.send();

obviously GET is replaced with POST - the URL loses the q= and the +str goes - but how are the POST variables actually passed?

Thanks
0
Comment
Question by:Bergstr
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
  • 3
9 Comments
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 37776026
basically you need to pass the data in the send() method as a parameter

var parameters = {
  "q":str;
};
xmlhttp.send(parameters);
0
 

Author Comment

by:Bergstr
ID: 37776107
That looks like what im after but it doesnt seem to be working - heres the updated code that im using:

<script type="text/javascript">
function StockCodeInfo(str)
 {
 var xmlhttp;
 if (str=="")
   {
   document.getElementById("StockCodeInfo").innerHTML="";
   return;
   }
 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("StockCodeInfo").innerHTML=xmlhttp.responseText;
     }
   }
 var parameters = {"q": str;  };

 xmlhttp.open("POST","ajax/stockcodeinfo.php",true);
 xmlhttp.send(parameters);
 }
 
 </script>

In dreamweaver it says: there is a syntax error on line 37 (which is the new line) and when that script runs in a browser, it doesnt return any data at all from the new page (which it was doing previously - just not with the variables)

Any idea where thats gone wrong?

Thanks
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 20

Expert Comment

by:BuggyCoder
ID: 37776122
i don't understand why you want to write in javascript when there is a better alternative in JQuery and that too with too less code...

Try giving it a thought....
0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 37776223
make
var parameters = {"q": str;  };

as

var parameters = {"q": str  };
0
 

Author Comment

by:Bergstr
ID: 37776268
OK - That line is fixed - but its now failing as soon as I change:

 xmlhttp.send();

to:

 xmlhttp.send(parameters);

- as soon as that line is changed it stops loading the second page again?

Buggycoder - i'm sure there are others ways to do this, but at the moment id simply like to get the code I already have working - at the moment i dont want to look at something completely new - I will take a look at it though :) Thanks for the info
0
 
LVL 20

Accepted Solution

by:
BuggyCoder earned 1000 total points
ID: 37776294
Glad that i was able to help you to learn something new.
Anyways here is how to post using xmlhttprequest object:-

var url = "get_data.php";
var params = "lorem=ipsum&name=binny";
http.open("POST", url, true);

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

http.onreadystatechange = function() {//Call a function when the state changes.
	if(http.readyState == 4 && http.status == 200) {
		alert(http.responseText);
	}
}
http.send(params);

Open in new window


Refer here For Furthur Details:-
http://www.openjs.com/articles/ajax_xmlhttp_using_post.php
http://www.devx.com/DevX/Tip/17500
0
 
LVL 40

Assisted Solution

by:Gurvinder Pal Singh
Gurvinder Pal Singh earned 1000 total points
ID: 37776303
0
 

Author Comment

by:Bergstr
ID: 37776370
The last 2 posts combined got me the result i was after :)

gurvinder372 - the parameter you mentioned was correct:

var parameters = "q="+str;


Buggycoder - i noticed on one of your links it mentions that you must add the http request header for the post function to work - without that i was getting no results at all.

Here is the final code im using for reference:

 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("StockCodeInfo").innerHTML=xmlhttp.responseText;
     }
   }

var params = "q="+str;


 xmlhttp.open("POST","ajax/stockcodeinfo.php",true);
 
 //Send the proper header information along with the request
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.setRequestHeader("Content-length", params.length);
xmlhttp.setRequestHeader("Connection", "close");

 xmlhttp.send(params);
 }
 
 </script>

Thanks very much for the help
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to dynamically set the form action using jQuery.
Suggested Courses

604 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question