posting html form in ajax

[preetksaini]

hi,
i want to post an html form on the click of a button to an ajax function,this ajax function will pass this fom object to a php page,where i want to fetch all the values entered by user in the form.

can anyone help me to do this,as im not able to pass the whole form and access the form values in php page.

thank you.

[ak1dnar]

Where is the HTML form ? and Ajax script so far you have completed.

[preetksaini]

i did not understand your question clearly.please can u be bit more clear about what u want to know.

thank you.

[ak1dnar]

i did not understand your question clearly.please can u be bit more clear about what u want to know.

thank you.

I need your HTML form and JS script. Please post it here.

[preetksaini]

this is my html code:
[HTML]<form name="frminfo" action="<?php $_SERVER['PHP_SELF']?>" method="post">
<table width="85%" border="0" align="center">
<tr>
<td valign="top" class="desc">
State <font class="red">*</font>
</td>
<td valign="top" colspan="3">
<select name="selstate" onchange="showC ity(this.value) ;" class="txtsty">
<option value="">Select State</option>
<option value="1">Mahar ashtra</option>
<option value="2">Delhi </option>
<option value="3">Gujar at</option>
<option value="4">Punja b</option>
</select>
</td>
</tr>
<tr>
<td valign="top" class="desc">
City <font class="red">*</font>
</td>
<td valign="top">
<div id="divcity"></div>
</td>
<td valign="top" colspan="2">
<input type="button" name="btncity" value="Add City" onclick="javaSc ript:openPop(55 0,150)" class="btn">
</td>
</tr>
<tr>
<td valign="top" class="desc">
School <font class="red">*</font>
</td>
<td valign="top">
<div id="divschool"> </div>
</td>
<td valign="top" colspan="2">
<input type="button" class="btn" name="btnschool " value="Add Institute" onclick="return valschool();">
</td>
</tr>

<tr>
<td valign="top" class="desc">
Contact Person Met<font class="red">*</font>
</td>
<td valign="top">
<input type="text" name="txt1">
</td>
</tr>

<tr>
<td valign="top" align="left" class="desc">
Remarks <font class="red"></font>
</td>
<td valign="top">
<textarea name="remarks" maxlength="350" rows="5" cols="25" class="txtsty"> </textarea>
</td>
</tr>
<tr>
<td valign="top" class="desc">
Call Analysis <font class="red">*</font>
</td>
<td valign="top" colspan="2">
<select name="scall" class="txtsty">
<option value="">Select Call Analysis</option>
<option value="1">First Call(Tele)</option>
<option value="2">Follo w up call(Tele)</option>
<option value="3">First call (Field)</option>
<option value="1">Follo w up call(Field)</option>
</select>
</td>
</tr>

<tr>
<td valign="top" class="desc">
School Status <font class="red">*</font>
</td>
<td valign="top">
<select name="sel1">
<option value="">Select </option>
<option value="1">Inter ested</option>
<option value="2">Unint erested</option>
<option value="3">Undec ided</option>
</select>
</td>
</tr>
<tr>
<td valign="top" align="right" class="desc">
Next Contact Date<font class="red"></font>
</td>
<td valign="top" colspan="3">
<INPUT TYPE="text" NAME="sdate" VALUE="<?php echo $sdate;?>" SIZE="10" maxlength="10" readonly class="txtsty">
<A HREF="#" onClick="cal.se lect(document.f orms['frminfo'].sdate,'anchor1 ','dd/MM/yyyy'); return false;"
NAME="anchor1" ID="anchor1">se lect</A>
</td>
</tr>
<tr>
<td valign="top" colspan="4" align="center">
<input type="button" name="btn1" class="btn" onclick="addDet ails(this.form) ;" value=" Save Details ">
</td>
<td>
<div id="divtest"></div>
</td>
</tr>
</table>
</form>[/HTML]

button : btn1 is the button on the click of which i call function addDetails(this .form);

and the ajax function addDetails is

function addDetails(form1)
{ 
	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	{
		alert ("Your browser does not support AJAX!");
		return;
	} 
	
	alert(form1);
	var url="ajax_add.php";
	xmlHttp.onreadystatechange=stateChanged4;
	xmlHttp.open("POST",url,true);
	xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	//xmlHttp.setRequestHeader("Content-length",form1.length);
	//xmlHttp.setRequestHeader("Connection", "close");
	xmlHttp.send(form1);
}
function stateChanged4() 
{ 
	if (xmlHttp.readyState==4)
	{
		document.getElementById("divtest").innerHTML=xmlHttp.responseText;
	}
}

this is my php code where i need to fetch the values from html form:

[PHP] $txtdate=$_POST["txtdate"];
$date=$txtdate;
$sid=$_POST["selstate"];
$cid=$_POST["selcity"];
$school=$_POST["school"];
$svid=$_POST["svisit"];
$cperson=$_POST["cperson"];
$scid=$_POST["scall"];
$remarks=$_POST["remarks"];
$min_to = $_POST["minto"];
$time_to = $_POST["timeto"];
$min_from = $_POST["minfrom"];
$time_from = $_POST["timefrom"];
$sdate=$_POST["sdate"];
$status=$_POST['status'];



$fromdate1=arra y();
$fromdate1 = explode("/",$date);
$dat=$fromdate1[0];
$mon=$fromdate1[1];
$year=$fromdate 1[2];
$date= $year."-".$mon."-".$dat;

$currentdatetim e=date("Y-m-d H:i:s");

$insertquery="i nsert into daily_transacti on(zid,uid,date _user,date_sche dule,sid,cid,ss id,institute_id ,status_id,cont act_person,call _id,remarks,tim e_from,min_from ,time_to,min_to ,date)values('$ zid','$userid', '$date','$sdate ','$sid','$cid' ,'$status','$sc hool','$svid',' $cperson', '$scid','".adds lashes($remarks )."','$time_fro m','$min_from', '$time_to','$mi n_to','$current datetime')";

$result = mysql_query($in sertquery);[/PHP]




javascript error im getting is "INCORRECT PARAMETER PASSED"


thanx.

[dmjpro]

i m also waiting for that .....

[preetksaini]

please can anyone help me for the same.

thanx.

[acoder]

You have to send parameters, not form1, e.g.

"txtdate="+form1.txtdate.value+"&seldate="+form1.seldate.value+...

For Firefox, if you're not sending back a valid XML response, override the mimetype.

[dmjpro]

ok .... i understand ... but can't i send it via POST method ????

plz help .... thanxxx in advance

[acoder]

That is via the post method. If it was a GET request, the send parameter would be null.

[ak1dnar]

function addDetails()
{ 
	xmlHttp=GetXmlHttpObject();
	if (xmlHttp==null)
	{
		alert ("Your browser does not support AJAX!");
		return;
	} 
	var some_var = form1.your_form_element.value;
	var another_var = form1.another_form_element.value;
	var url="ajax_add.php";
	xmlHttp.open("POST",url);
	xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	xmlHttp.onreadystatechange=stateChanged4;
	xmlHttp.send('var1='+some_var+'&var2='+another_var);
	/*PHP side use 
	$varname1 = $_POST['var1'];
	$varname2 = $_POST['var2'];
	*/
	
}
function stateChanged4() 
{ 
	if (xmlHttp.readyState==4)
	{
		document.getElementById("divtest").innerHTML=xmlHttp.responseText;
	}
}