Hmm, forget about refreshing?

[Kovo]

Hey guys!Its been a while since Ive seeked council, but Ive been putting together an online store ofr an American Apparel reseller and everything is going perfectly, however, I was wondering, is it possible to submit data through PHP and SQL without refreshing the page?In my example, once the viewer clicks the add to cart button for a particular product, I want the necessary data to be sent but I dont want the page to refresh... is this possible?Thanks

[Ingolme]

You can use AJAX, it maybe a bit hard to understand at first.Here's W3Schools' tutorial: http://w3schools.com/ajax/default.aspUnfortunately in W3Schools they never gave an example of actually sending data. To do that, just modify the script at W3Schools by adding this: xmlHttp.open("POST",filename,true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.send(querystring);

[mc_keny]

well in that case you in a form you need a page where they select what they want eg//place this in a file name order.php

 <form name="goods" method="post" action="buy.php"> Name: <input name="name" type="text"> <br> cloths: <select name="cloths" type="text"> <option value="pants">pants</option> <option value="shirt">shirt</option> <br> <input type="submit" name="Submit" value="buy"> </form> //this code below in buy php $ =shirt trim($_POST['shirt']); $pants = trim($_POST['pants']); //some codes

[Kovo]

You can use AJAX, it maybe a bit hard to understand at first.Here's W3Schools' tutorial: http://w3schools.com/ajax/default.aspUnfortunately in W3Schools they never gave an example of actually sending data. To do that, just modify the script at W3Schools by adding this: xmlHttp.open("POST",filename,true); xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xmlHttp.send(querystring);

Cool,This is what basically sends the data:

<?if(isset($_POST['id'])){	$loginstring = $_COOKIE['taadi'];		$value = $loginstring . $_POST['id'] . ' ' . $_POST['size'] . ' ' . $_POST['color'] . ' ' . $_POST['qty'] . ".";		$msg = "";	if($cookieValue = setcookie("taadi", $value, time() + 3600))	{		$msg="<script src=\"js/humanize.js\" type=\"text/javascript\"></script><script type=\"text/javascript\">window.addEvent('domready', showMessage());</script>";	}}?>

How would that translate to AJAX?Im assuming it'd just execute the ajax function onclick of a button.

[Ingolme]

You put the PHP in a separate page, exactly the same way it is, you call that page with AJAX:xmlHttp.open("POST",filename,true);

[Kovo]

I came up with this, but nothing actually posts...

<script type="text/javascript">		function ajaxFunction()  {  var xmlHttp;  try    {    // Firefox, Opera 8.0+, Safari    xmlHttp=new XMLHttpRequest();    }  catch (e)    {    // Internet Explorer    try      {      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");      }    catch (e)      {      try        {        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");        }      catch (e)        {        alert("Your browser does not support AJAX!");        return false;        }      }    }    xmlHttp.open("POST","post.php",true);		xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  }		</script>

[Synook]

You forgot the send() command after settting request headers you need to execute xmlHttp.send(data) for example

item = document.getElementById("items").value;amount = document.getElementById("amount").value;xmlttp.send("item=" + item + "&amount=" + amount);

[Ingolme]

For safety, try using encodeURIComponent on anything you want to add to the query string:item = encodeURIComponent(document.getElementById("items").value);xmlHttp.send("item="+item);

[Kovo]

For safety, try using encodeURIComponent on anything you want to add to the query string:item = encodeURIComponent(document.getElementById("items").value);xmlHttp.send("item="+item);

How would the code look with the data I have to send? Like " $value = $loginstring . $_POST['id'] . ' ' . $_POST['size'] . ' ' . $_POST['color'] . ' ' . $_POST['qty'] . "."; "your example tells me that I need to give each element an ID... is that the only way>?

[Ingolme]

Each <input> tag needs to have an ID to make it easier to reference with the getElementById() function.

[Kovo]

Each <input> tag needs to have an ID to make it easier to reference with the getElementById() function.

awesomethe issue I see is with the select and option tags

[Synook]

Well, what HTML code do you have at the moment?