ob1_
asked on
how do i pass a java variable through an HTML form (using POST)?
I have the Java function below in an HTML page.
the HTML page is laid out as follows:
<head>
<script>
</script>
<head>
<body>
<form method="POST" action="process.asp">
</form>
</body>
in the HTML form I have several text box "inputs" - these are passed to the page, "process.asp" which then writes this info to a text file.
there is a java variable in the script called "num". this number represents the # of items in the form and I need to pass it to the "process.asp" page as well - how would i do this?
thanks,
ob1
the HTML page is laid out as follows:
<head>
<script>
</script>
<head>
<body>
<form method="POST" action="process.asp">
</form>
</body>
in the HTML form I have several text box "inputs" - these are passed to the page, "process.asp" which then writes this info to a text file.
there is a java variable in the script called "num". this number represents the # of items in the form and I need to pass it to the "process.asp" page as well - how would i do this?
thanks,
ob1
function addEvent() {
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").value -1)+ 2;
numi.value = num;
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
newdiv.innerHTML = "<table width=\"100%\" border=\"1\" rules=\"cols\"><colgroup><col width=\"30%\"><col width=\"70%\"></colgroup><tr><td>Name:<a href=\"javascript:;\" onclick=\"removeElement(\'"+divIdName+"\')\" style=\"text-decoration:none; color: blue;\"> (Remove)</a></td><td><input type=\"text\" name=\"Client Name "+(num+1)+"\" size=\"79\" style=\"background-color:white;border:0px solid white;\"></input></td></tr><tr><td>Email:</td><td><input type=\"text\" name=\"Client Email "+(num+1)+"\" size=\"79\" style=\"background-color:white;border:0px solid white;\"></input></td></tr></table>";
ni.appendChild(newdiv);
}ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
can i just type html into the javascript section or do i need to specify it somehow? if i add the hidden variable into the html form like the 2nd post suggest, how would i set the value with javascript?
thanks,
ob1
thanks,
ob1
It's better and clearer to show the html in your form along with the other <input> elements
> can i just type html into the javascript section or do i need to specify it somehow?
you can do either
> if i add the hidden variable into the html form like the 2nd post suggest, how would i set the value with javascript?
something like:
form.elements["hiddenName"
you can do either
> if i add the hidden variable into the html form like the 2nd post suggest, how would i set the value with javascript?
something like:
form.elements["hiddenName"
ASKER
something like:
form.elements["hiddenName"].value = 'Value';
where whould i put this? up in the script section in the function?
thanks,
ob1
I gave you code in my first comment (which corresponds with your existing code) - did you use it?
ASKER
oooh ok i get it now.. i will do that and get back to you
ASKER
does this look right? the variable doesn't seem to be coming through the form. please see lines 33 and 117.
thanks,
ob1
thanks,
ob1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sandbox Request Form</title>
<link href="master.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="inc/popupWindow.js"></script>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.9.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.9.custom.min.js"></script>
<script type="text/javascript">
$(function(){
// Datepicker
$('#datepicker1').datepicker({
dateFormat: "yy-M-dd",
inline: true
});
$('#datepicker2').datepicker({
dateFormat: "yy-M-dd",
inline: true
});
});
function addEvent() {
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById("theValue").value -1)+ 2;
numi.value = num;
form.elements["intRequests"].value = num+1;
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
newdiv.innerHTML = "<table width=\"100%\" border=\"1\" rules=\"cols\"><colgroup><col width=\"30%\"><col width=\"70%\"></colgroup><tr><td>Name:<a href=\"javascript:;\" onclick=\"removeElement(\'"+divIdName+"\')\" style=\"text-decoration:none; color: blue;\"> (Remove)</a></td><td><input type=\"text\" name=\"Client Name "+(num+1)+"\" size=\"79\" style=\"background-color:white;border:0px solid white;\"></input></td></tr><tr><td>Email:</td><td><input type=\"text\" name=\"Client Email "+(num+1)+"\" size=\"79\" style=\"background-color:white;border:0px solid white;\"></input></td></tr></table>";
ni.appendChild(newdiv);
}
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
</script>
</head>
<body>
<div id="page-container">
<div id="header">
<img src="header.png" width="739" height="96" />
</div> <!-- header -->
<div id="top-spacer">
</div> <!-- top-spacer -->
<i>Account Request Form</i>
<div id="content1">
<form method="POST" name="setup" accept-charset="utf-8" action="SendSetup_test.asp" >
<table width="739" border="1" bgcolor="#CCCCCC">
<tr height="30">
<td width="40%">Is this a request to extend an existing account?</td>
<td><input type="radio" name="Extension" value="Yes"/>Yes <input type="radio" name="Extension" value="No"/>No</td>
</tr>
</table>
<table width="739" border="1" bgcolor="#CCCCCC">
<colgroup>
<col width="30%">
<col width="70%">
</colgroup>
<tr height="30">
<td>Requestor Name:</td>
<td width><input type="text" name="Requestor Name" style="background-color:white;border:0px solid white;height:22px;" size="79"/></td>
</tr>
<tr height="30">
<td>Requestor Email:</td>
<td><input type="text" name="Requestor Email" style="background-color:white;border:0px solid white;height:22px;" size="79"/></td>
</tr>
<tr height="30">
<td>Client Company:</td>
<td><input type="text" name="Client Company" style="background-color:white;border:0px solid white;height:22px;" size="79"/></td>
</tr>
<tr height="30">
<td>Client Name:</td>
<td><input type="text" name="Client Name" style="background-color:white;border:0px solid white;height:22px;" size="79"/></td>
</tr>
<tr height="30">
<td>Client Email:</td>
<td><input type="text" name="Client Email" style="background-color:white;border:0px solid white;height:22px;" size="79"/></td>
</tr>
<tr height="30">
<td><input name="Add User" type="button" value="Add User" onclick="addEvent()"></td><td> </td>
</tr>
<tr height="30"><td colspan="2">
<div id="myDiv"></div></td></tr>
<tr height="30">
<td>Account Period:</td>
<td>
<table height="10">
<tr>
<td>Begin Date</td>
<td><input type="text" name="Begin Date" id="datepicker1" maxlength="10" size="8" style="height:22px;" /> </td>
<td width="30"></td>
<td>End Date:</td>
<td><input type="text" name="End Date" id="datepicker2" maxlength="10" size="8" style="height:22px;" /> </td>
</tr>
</table>
</td>
</tr>
<tr height="30"><td align="left" valign="top">Comments or Instructions:</td><td colspan="4" height="100"><textarea rows="8" name="Comments" cols="61" style="background-color:white;border:0px solid white;"></textarea></td></tr>
<tr>
<td> <input name="Submit" type="submit" value="Submit" /></td>
<td> </td>
</tr>
</table>
<input name="intRequests" type="hidden"></input>
</form>
</div>
<tr><td><input type="hidden" value="0" id="theValue" />
<div id="myDiv"></div></td></tr>
<p> </p>
</body>
</html>ASKER
when I try to set the value in the script (line 33 above) - the script breaks. any ideas?
That's not the code i gave you ;)
try this:
function addEvent() {
var ni = document.getElementById('m
var numi = document.getElementById('t
var num = (document.getElementById("
numi.value = num;
myform = document.forms['setup'];
myform.elements["intReques
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('di
newdiv.setAttribute("id",d
newdiv.innerHTML = "<table width=\"100%\" border=\"1\" rules=\"cols\"><colgroup><
ni.appendChild(newdiv);
}
function addEvent() {
var ni = document.getElementById('m
var numi = document.getElementById('t
var num = (document.getElementById("
numi.value = num;
myform = document.forms['setup'];
myform.elements["intReques
var divIdName = "my"+num+"Div";
var newdiv = document.createElement('di
newdiv.setAttribute("id",d
newdiv.innerHTML = "<table width=\"100%\" border=\"1\" rules=\"cols\"><colgroup><
ni.appendChild(newdiv);
}
ASKER
thanks!
:)
easiest would be to add the hidden variable directly in your html (with no value).
Then have your javascript set the value