By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,144 Members | 849 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,144 IT Pros & Developers. It's quick & easy.

posting html form in ajax

P: 19
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.
Mar 22 '07 #1
Share this Question
Share on Google+
10 Replies


ak1dnar
Expert 100+
P: 1,584
Where is the HTML form ? and Ajax script so far you have completed.
Mar 22 '07 #2

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

thank you.
Mar 22 '07 #3

ak1dnar
Expert 100+
P: 1,584
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.
Mar 22 '07 #4

P: 19
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="showCity(this.value);" class="txtsty">
<option value="">Select State</option>
<option value="1">Maharashtra</option>
<option value="2">Delhi</option>
<option value="3">Gujarat</option>
<option value="4">Punjab</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="javascript:openPop(550,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">Follow up call(Tele)</option>
<option value="3">First call (Field)</option>
<option value="1">Follow 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">Interested</option>
<option value="2">Uninterested</option>
<option value="3">Undecided</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.select(document.forms['frminfo'].sdate,'anchor1','dd/MM/yyyy'); return false;"
NAME="anchor1" ID="anchor1">select</A>
</td>
</tr>
<tr>
<td valign="top" colspan="4" align="center">
<input type="button" name="btn1" class="btn" onclick="addDetails(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

Expand|Select|Wrap|Line Numbers
  1. function addDetails(form1)
  2.     xmlHttp=GetXmlHttpObject();
  3.     if (xmlHttp==null)
  4.     {
  5.         alert ("Your browser does not support AJAX!");
  6.         return;
  7.     } 
  8.  
  9.     alert(form1);
  10.     var url="ajax_add.php";
  11.     xmlHttp.onreadystatechange=stateChanged4;
  12.     xmlHttp.open("POST",url,true);
  13.     xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  14.     //xmlHttp.setRequestHeader("Content-length",form1.length);
  15.     //xmlHttp.setRequestHeader("Connection", "close");
  16.     xmlHttp.send(form1);
  17. }
  18. function stateChanged4() 
  19.     if (xmlHttp.readyState==4)
  20.     {
  21.         document.getElementById("divtest").innerHTML=xmlHttp.responseText;
  22.     }
  23. }
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=array();
$fromdate1 = explode("/",$date);
$dat=$fromdate1[0];
$mon=$fromdate1[1];
$year=$fromdate1[2];
$date= $year."-".$mon."-".$dat;

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

$insertquery="insert into daily_transaction(zid,uid,date_user,date_schedule, sid,cid,ssid,institute_id,status_id,contact_person ,call_id,remarks,time_from,min_from ,time_to,min_to,date)values('$zid','$userid','$dat e','$sdate','$sid','$cid','$status','$school','$sv id','$cperson', '$scid','".addslashes($remarks)."','$time_from','$ min_from','$time_to','$min_to','$currentdatetime') ";

$result = mysql_query($insertquery);[/PHP]




javascript error im getting is "INCORRECT PARAMETER PASSED"


thanx.
Mar 22 '07 #5

dmjpro
100+
P: 2,476
i m also waiting for that .....
Mar 22 '07 #6

P: 19
please can anyone help me for the same.

thanx.
Mar 22 '07 #7

acoder
Expert Mod 15k+
P: 16,027
You have to send parameters, not form1, e.g.
Expand|Select|Wrap|Line Numbers
  1. "txtdate="+form1.txtdate.value+"&seldate="+form1.seldate.value+...
For Firefox, if you're not sending back a valid XML response, override the mimetype.
Mar 22 '07 #8

dmjpro
100+
P: 2,476
ok .... i understand ... but can't i send it via POST method ????

plz help .... thanxxx in advance
Mar 22 '07 #9

acoder
Expert Mod 15k+
P: 16,027
That is via the post method. If it was a GET request, the send parameter would be null.
Mar 22 '07 #10

ak1dnar
Expert 100+
P: 1,584
Expand|Select|Wrap|Line Numbers
  1. function addDetails()
  2.     xmlHttp=GetXmlHttpObject();
  3.     if (xmlHttp==null)
  4.     {
  5.         alert ("Your browser does not support AJAX!");
  6.         return;
  7.     } 
  8.     var some_var = form1.your_form_element.value;
  9.     var another_var = form1.another_form_element.value;
  10.     var url="ajax_add.php";
  11.     xmlHttp.open("POST",url);
  12.     xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  13.     xmlHttp.onreadystatechange=stateChanged4;
  14.     xmlHttp.send('var1='+some_var+'&var2='+another_var);
  15.     /*PHP side use 
  16.     $varname1 = $_POST['var1'];
  17.     $varname2 = $_POST['var2'];
  18.     */
  19.  
  20. }
  21. function stateChanged4() 
  22.     if (xmlHttp.readyState==4)
  23.     {
  24.         document.getElementById("divtest").innerHTML=xmlHttp.responseText;
  25.     }
  26. }
Mar 22 '07 #11

Post your reply

Sign in to post your reply or Sign up for a free account.