Solved

Ajax return a form using innerHTML

Posted on 2009-05-14
2
765 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
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

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

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

Hello World !, Thanks : My Sincere thanks to @Michael Male who encouraged me to write an article on this in my  blog (http://scribblejava.wordpress.com). Introduction:       There are several technical issues a developer may face in his…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
Two types of users will appreciate AOMEI Backupper Pro: 1 - Those with PCIe drives (and haven't found cloning software that works on them). 2 - Those who want a fast clone of their boot drive (no re-boots needed) and it can clone your drive wh…
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

773 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