Solved

Ajax return a form using innerHTML

Posted on 2009-05-14
2
770 Views
Last Modified: 2012-05-07
I got two selectboxes and when select each option it returns the ajax data through innerHTML. The ajax data return a complete form including labels,buttons,textfields. This seems to be working but i want to know if its safe or practical to send a complete form via ajax? if not, are there any alternative method i can use to send ajax data into a form? i've attached my code below. please let me know any comments.
************** Ajax code *************
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){
var ajaxDisplay2 = document.getElementById('priceDiv');
ajaxDisplay2.innerHTML = ajaxRequest.responseText;
}
}
var prodref = document.getElementById('prodref').value;
var color = document.getElementById('color').value;
var packaging = document.getElementById('packaging').value;
 
var queryString = "?prodref=" + prodref + "&att1=" + color + "&att2=" + packaging ;
ajaxRequest.open("GET", "/includes/php/ajax_shopping_update.php" + queryString, true);
ajaxRequest.send(null); 
//alert(queryString);
}
 
 
***************product.php**********************
<select name="packaging" class="product_formDropdown" onChange="ajaxFunction();">
<option value="">--- Select Packaging ---</option>
<?php 
while($rsatt2 = mysql_fetch_array($rsgetatt2))
{
echo '<option value="'.$rsatt2['packaging'].'">'.$rsatt2['packaging'].'</option>';
}
?>
</select>
<div id='priceDiv'><p><strong>choose options</strong>
 
*******************************************************
*********ajax-shopping-update.php**************
$prodref = $_GET['prodref'];
$color = $_GET['att1'];
$packaging = $_GET['att2'];
 
if ($prodref != "")
{
$query2 = "SELECT * FROM sub_products WHERE prod_ref='".$prodref."' AND attribute1='".$color."' AND attribute2='".$packaging."'";
$result=mysql_query($query2);
$row=mysql_fetch_array($result);
echo '<form method="post" class="product_form" action="shopping_basket.php">
		<h2><strong>Price : ' .$row['price']. '</strong></h2>
		<p>
		<input type="image" src="/images/product-add.gif" value="Submit" class="product_form_button">
		</p>
	</form>';
 
mysql_close();
 
}
*************************************************

Open in new window

0
Comment
Question by:Herci
[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
2 Comments
 
LVL 4

Expert Comment

by:Fugas
ID: 24385349
I'm using prototype.js to make Ajax calls. It also directly supports POST method and to the call you may use only the serialize() method of the form. All you need to know is here http://www.prototypejs.org/
0
 

Accepted Solution

by:
Herci earned 0 total points
ID: 25330483
I managed to solve this by just calling the form containing page through an ajax request display in a DIV
0

Featured Post

Independent Software Vendors: 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!

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
PHP AJAX Wordpress 9 51
How can i  prevent default  Submision? 6 39
converting document.write() to innerHTML 7 81
Google Chrome: Debugging AJAX call 6 39
ASP.NET AJAX callbacks to web service are becoming very popular and unavoidable these days. The feel that the user gets when only a part of the page is updated without even hindering the UI is the advantage that the callbacks offer. The wait for the…
The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Finding and deleting duplicate (picture) files can be a time consuming task. My wife and I, our three kids and their families all share one dilemma: Managing our pictures. Between desktops, laptops, phones, tablets, and cameras; over the last decade…

759 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