Ajax return a form using innerHTML

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


// Opera 8.0+, Firefox, Safari

ajaxRequest = new XMLHttpRequest();

} catch (e){

// Internet Explorer Browsers


ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");

} catch (e) {


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 ;"GET", "/includes/php/ajax_shopping_update.php" + queryString, true);





<select name="packaging" class="product_formDropdown" onChange="ajaxFunction();">

<option value="">--- Select Packaging ---</option>


while($rsatt2 = mysql_fetch_array($rsgetatt2))


echo '<option value="'.$rsatt2['packaging'].'">'.$rsatt2['packaging'].'</option>';




<div id='priceDiv'><p><strong>choose options</strong>



$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."'";



echo '<form method="post" class="product_form" action="shopping_basket.php">

		<h2><strong>Price : ' .$row['price']. '</strong></h2>


		<input type="image" src="/images/product-add.gif" value="Submit" class="product_form_button">






Open in new window

Question by:Herci

Expert Comment

Comment Utility
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

Accepted Solution

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

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Hello World !, Thanks : My Sincere thanks to @Michael Male who encouraged me to write an article on this in my  blog ( Introduction:       There are several technical issues a developer may face in his…
Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
In this tutorial you'll learn about bandwidth monitoring with flows and packet sniffing with our network monitoring solution PRTG Network Monitor ( If you're interested in additional methods for monitoring bandwidt…
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

744 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

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now