PDA

Click to See Complete Forum and Search --> : Form Help If and or ELSE

Technane
09-07-2005, 03:28 AM
Wondering if anyone knows a way to make and argument
like IF and or else from excel work utilising HTml?
or if someoen can help me using JAVA.

this has all come about due to the request to turn a current Excel form into a more widely useable format!

I hope you all understand what im asking
Best regards
Technane
Technane
09-07-2005, 06:10 AM
Should of posted this before,
a sample of the form code this question relates to.

What I want to do is if the user select's "other" first then the subsequent text box will display "please state stencil thickness" id also like to make it so in all other conditions this box is disabled

<form name="thick" >
<select name="stencthick" size="1">
<option>0.100MM (0.004&quot;)</option>
<option>0.125MM (0.005&quot;)</option>
<option>0.150MM (0.006&quot;)</option>
<option>0.200MM (0.008&quot;)</option>
<option>0.250MM (0.010&quot;)</option>
<option>other</option>
<option selected> </option>
</select>
if other
<input name="stencthickother" type="text" value="please state stencil thickness " size="40"> </form>
muneepenee
09-07-2005, 02:50 PM
1. it sound like yu want 1 input form & then if yuzer select "other" from it, yu want tu put up a drop box for him tu select thikness.
2. input forms & drop boxes R part af html. Wot yu du wen yuzer klik or submit is javaskript.
3. but yu want tu make a drop box at run time based on input from prior form.
thats "dynamik"...yu gotta get a lot av speerens with javaskripts b4 yu tri that.
ray326
09-07-2005, 09:44 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Conforming HTML 4.01 Template</title>
<script type="text/javascript">
function checkpick(sel)
{
if (sel.value == "other")
document.getElementById("stencthickother").style.visibility="visible"
else
document.getElementById("stencthickother").style.visibility="hidden"
}
</script>
</head>
<body>
<form name="thick" >
<select name="stencthick" size="1" onchange="checkpick(this)">
<option selected>Pick one</option>
<option value="0.100MM">0.100MM (0.004&quot;)</option>
<option value="0.125MM">0.125MM (0.005&quot;)</option>
<option value="0.150MM">0.150MM (0.006&quot;)</option>
<option value="0.200MM">0.200MM (0.008&quot;)</option>
<option value="0.250MM">0.250MM (0.010&quot;)</option>
<option value="other">other</option>
</select>
<input name="stencthickother" id="stencthickother" style="visibility:hidden"
type="text" value="please state stencil thickness" size="40">
</form>
</body>
</html>
Technane
09-08-2005, 02:41 AM
many thanks for your help ray but still stumbling
as i forgot to mention i need this to work on more than one form on the page
see code for how i assumed it would opperate but as you can see no dice
am i missing this method or should i be using one fucntion and using id's to instigate select values? arggghhh can you tell im new to JAVAscript!
as to me the code below looks like it should work but i cant ascertain why it doesn't!

<HTML>
<head>
<script type="text/javascript">
function james1(sel)
{
if (sel.value == "other")
document.getElementById("stencthickother").style.visibility="visible"

else
document.getElementById("stencthickother").style.visibility="hidden"

}

function james2(sel)
{
if (sel.value == "other")
document.getElementById("machother").style.visibility="visible"

else
document.getElementById("machother").style.visibility="hidden"

}
</script>
</head>
<form name="thick" >
<select name="stencthick" size="1" onchange="james1(this)">
<option selected>Pick one</option>
<option value="0.100MM">0.100MM (0.004&quot;)</option>
<option value="0.125MM">0.125MM (0.005&quot;)</option>
<option value="0.150MM">0.150MM (0.006&quot;)</option>
<option value="0.200MM">0.200MM (0.008&quot;)</option>
<option value="0.250MM">0.250MM (0.010&quot;)</option>
<option value="other">other</option>
</select>
<input name="stencthickother" id="stencthickother" style="visibility:hidden"
type="text" value="please state stencil thickness" size="40">
</form>
<form name="Machine" >
<select name="Machine" size="1" onchange="james2(this)">
<option selected>Pick one</option>
<option>EKRA E1</option>
<option>EKRA E3</option>
<option>EKRA E5</option>
<option>DEK 240</option>
<option>DEK 245</option>
<option>DEK 247</option>
<option>DEK 248</option>
<option>DEK 249</option>
<option>DEK 250</option>
<option>DEK 260</option>
<option>DEK 265</option>
<option>MPM AP25</option>
<option>MPM AP27</option>
<option>MPM AP29</option>
<option>MPM 2000</option>
<option>MPM 3000</option>
<option>SMTECH 100</option>
<option>SMTECH 300</option>
<option>SMTECH 400</option>
<option>SMTECH 500</option>
<option>SMTECH 100</option>
<option>SPEEDPRINT A</option>
<option>SPEEDPRINT B</option>
<option>FUJI GSP 1</option>
<option>FUJI GSP 2</option>
<option>FUJI 641</option>
<option>REPRINT A</option>
<option>REPRINT COMPACT 29</option>
<option>ESSEMTECH SP002</option>
<option>ESSEMTECH SP003</option>
<option>KISTECH </option>
<option>OTHER</option>
</select>
<input name="machother" id="machother" style="visibility:hidden"
type="text" value="please state machine type/model" size="40">
</form>

</html>
ray326
09-08-2005, 12:54 PM
1. You haven't set values for the options.
2. The string comparison is case sensitive.
Technane
09-12-2005, 02:54 PM
thanks again Ray got it cracked now
even managed to figure out dif options giving dif results into the text box's

now for my next question
I want to have the user input into a text field at the top of page and have this written into the Html further down way i thought best to do this was

in head of page between script
var name=document.getElementById("name");

then in the body of page in between script tags again
document.writeln(name);

all i get is Null displayed? any ideas?
ray326
09-12-2005, 11:37 PM
Normally you'd either use innerHTML or the DOM (add a node) for that. I'm not sure what your intent is above but I suspect it might really be:

var name=document.getElementById("name").value
Technane
09-13-2005, 03:45 AM
Damn sorry maybe didnt explain well enough
heres my complete code you can see at the top of the form
there are three box's callled customer, order number and part number
and further down under technical specification. these fields need ot be repeated
this has come about so you can easily split the two parts into our technical section and order section and still keep full traceablity
instead of asking the user to infill twice id rather anything typed into the top fields auto filled to the lower part. is there a way of doing this without needing a page reload to submit. I have removed some of the larger selects to save on post space

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function james1(sel)
{
if (sel.value == "Other")
document.getElementById("stencthickother").style.visibility="visible"
else
document.getElementById("stencthickother").style.visibility="hidden"

}
function repeat(sel)
{
if (sel.value == "Yes")
document.getElementById("stepyes").style.visibility="visible"

else
document.getElementById("stepyes").style.visibility="hidden"

}

function JAMES3(sel)
{
if (sel.value == "OTHER")
document.getElementById("imageother").style.visibility="visible"

else
document.getElementById("imageother").style.visibility="hidden"

if (sel.value == "OFFSETT FRONT EDGE")
document.getElementById("imageoffsett").style.visibility="visible"

else
document.getElementById("imageoffsett").style.visibility="hidden"

}
function MULTI(sel)
{
if (sel.value == "Yes")
document.getElementById("multiyes").style.visibility="visible"
else
document.getElementById("multiyes").style.visibility="hidden"
}
{
var cust=document.getElementById("customer").value
var order=document.getElementById("ordernumber").value
var part=document.getElementById("partno").value
}
</script>
<style type="text/css">
<!--
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
}
.style3 {font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: x-large; }
.style4 {
color: #FF0000;
font-weight: bold;
}
-->
</style>
</head>

<body>
<table width="734" border="0">
</table>
<table width="735" height="1172" border="0">
<tr>
<td height="23" colspan="2" align="center" valign="middle" bgcolor="#999933"><span class="style3">TSL ORDER FORM </span></td>
</tr>
<tr>
<td width="240" align="left" valign="top" class="style1">CUSTOMER</td>
<td width="485" align="left" valign="top"><form name="customer" >
<input name="customer" type="text" id="customer" value="Please give your company name " size="40">
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">ORDER NO. </td>
<td align="left" valign="top"><input name="ordernumber" type="text" id="ordernumber" value="please state your order number" size="40"></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">PART NO. </td>
<td align="left" valign="top"><input name="partno" type="text" id="partno" value="please state your part number" size="40"></td>
</tr>
<tr>
<td colspan="2" align="left" valign="top" class="style1">DELIVERY ADDRESS </td>
</tr>
<tr>
<td colspan="2" align="left" valign="top"><form name="form2" method="post" action="">
<textarea name="textarea" cols="100" rows="5"></textarea>
</form></td>
</tr>
<tr>
<td colspan="2" align="left" valign="top" class="style1">INVOICE ADDRESS IF DIFFERENT FROM DELIVERY ADDRESS </td>
</tr>
<tr>
<td colspan="2" align="left" valign="top"><textarea name="textarea" cols="100" rows="5"></textarea></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">TEL NO. </td>
<td align="left" valign="top"><input name="textfield" type="text" size="40"></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">FAX NO </td>
<td align="left" valign="top"><input name="textfield" type="text" size="40"></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">TECHNICAL CONTACT. </td>
<td align="left" valign="top" class="style1"><input name="textfield" type="text" size="40"></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">DESPATCH.</td>
<td align="left" valign="top"><form name="form3" method="post" action="">
<input name="datefield" type="date" id="datefield">
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">DELIVERY.</td>
<td align="left" valign="top"><input name="datefield" type="date" id="datefield"></td>
</tr>
<tr bgcolor="#3366FF">
<td colspan="2" align="left" valign="top" class="style3"><div align="center">TECHNICAL DETAILS </div></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">Customer</td>
<td align="left" valign="top">
<script language="JavaScript">
<!-- hide me
document.writeln(cust);
// end hiding -->
</script></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">Order No. </td>
<td align="left" valign="top"><script language="JavaScript">
<!-- hide me
document.writeln(order);
// end hiding -->
</script></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">Part No.</td>
<td align="left" valign="top">
<script language="JavaScript">
<!-- hide me
document.writeln(part);
// end hiding -->
</script>
</td>
</tr>
<tr>
<td align="left" valign="top" class="style1">FILENAME</td>
<td align="left" valign="top"><form name="form5" method="post" action="">
<input name="textfield" type="text" value="Please type the name of your file" size="60">
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">TEXT REQUIRED ON STENCIL </td>
<td align="left" valign="top"><form name="form5" method="post" action="">
<input name="textfield" type="text" value="please type any text you require on your stencil" size="60">
</form></td>
</tr>
<tr>
<td height="26" align="left" valign="top" class="style1">STENCIL TYPE </td>
<td align="left" valign="top"><form name="stenctype" >
<select name="stenctype">
<option selected>Pick one</option>
<option>PRECISION ETCH S/S</option>
<option>LASER CUT S/S</option>
<option>NICKEL ELECTROFORM</option>
<option>MULTI LEVEL E/F</option>
<option>LASER CUT NICKEL E/F</option>
</select>
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">STENCIL THICKNESS </td>
<td align="left" valign="top">
<form name="thick" >
<select name="stencthick" size="1" onchange="james1(this)">
<option selected>Pick one</option>
<option value="0.100MM">0.100MM (0.004&quot;)</option>
<option value="0.125MM">0.125MM (0.005&quot;)</option>
<option value="0.150MM">0.150MM (0.006&quot;)</option>
<option value="0.200MM">0.200MM (0.008&quot;)</option>
<option value="0.250MM">0.250MM (0.010&quot;)</option>
<option value="Other">Other</option>
</select>
<input name="stencthickother" id="stencthickother" style="visibility:hidden"
type="text" value="please state stencil thickness" size="40">
</form>
</td>
</tr>
<tr>
<td align="left" valign="top" class="style1">IMAGE VIEW </td>
<td align="left" valign="top"><form name="image" >
<select name="image">
<option selected>Pick one</option>
<option>SQUEEGEE SIDE</option>
<option>NON SQUEEGEE SIDE</option>
</select>
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">SQUEEGEE DIRECTION </td>
<td align="left" valign="top"><form name="squeegeedir">
<select name="squeegeedir">
<option selected>Pick one</option>
<option>LONGEST LENGTH OF IMAGE</option>
<option>SHORTEST LENGTH OF IMAGE</option>
<option>45&deg; ROTATION</option>
</select>
</form></td>
</tr>
<tr>
<td align="left" valign="top" class="style1">STEP&amp;REPEAT</td>
<td align="left" valign="top"><form name="step">
<select name="step" size="1" onchange="repeat(this)">
<option selected>Pick one</option>
<option>Yes</option>
<option>No</option>
</select>
<input name="stepyes" type="text" class="style4" id="stepyes" style="visibility:hidden" value= "please supply a panel drawing" size="40" >
</form></td>
</tr>
<tr>
</tr>
<tr>
<td align="left" valign="top" class="style1">FIDUCIALS </td>
<td align="left" valign="top"><form name="Fiducials">
<select name="Fiducials">
<option selected>Pick one</option>
<option>SQUEEGEE SIDE</option>
<option>NON SQUEEGEE SIDE</option>
<option>FULLY CUT/ETCHED</option>
<option>NOT REQUIRED</option>
</select>
</form></td>
</tr>
<tr>
<td height="26" align="left" valign="top" class="style1">MULTIPLE IMAGES </td>
<td align="left" valign="top"><form name="multiimage" >
<select name="multiimage" size="1" onchange="MULTI(this)">
<option selected>Pick one</option>
<OPTION>Yes</OPTION>
<option>No</option>
</select>
<input name="multiyes" type="text" class="style4" id="multiyes" style="visibility:hidden" value= "PLEASE STATE AMOUNT OF PCB'S REQUIRED" size="50" ></form></td></tr>
</table>
</body></html>
ray326
09-13-2005, 09:06 PM
Here's an example sans table.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>

<style type="text/css">
label {
display:block;
width: 10em;
text-align:right;
margin: 0 1em 0 0;
float:left;
}
div input {
display:block;
margin:0 0 0 14em;
}
</style>

<script type="text/javascript">
function copyfromto(str, tbid)
{
document.getElementById(tbid).value=str
}
</script>

</head>

<body>
<form action="#" method="get">
<fieldset>
<legend>Form Inputs</legend>
<div><label for="customer">CUSTOMER</label>
<input name="customer" type="text" id="customer" size="40"
value="Please give your company name " tabindex="1"
onfocus="this.value=''"
onblur="copyfromto(this.value, 'cust2')"></div>
<div><label for="ordernumber">ORDER NO.</label>
<input name="ordernumber" type="text" id="ordernumber" size="40"
value="please state your order number" tabindex="2"
onfocus="this.value=''"
onblur="copyfromto(this.value, 'order2')"></div>
<div><label for="partno">PART NO. </label>
<input name="partno" type="text" id="partno" size="40"
value="please state your part number" tabindex="3"
onfocus="this.value=''"
onblur="copyfromto(this.value, 'partno2')"></div>
</fieldset>
<fieldset>
<legend>Repeated Values</legend>
<table>
<tr><th>Customer</th><td><input type="text" id="cust2" readonly></td></tr>
<tr><th>Order No.</th><td><input type="text" id="order2" readonly></td></tr>
<tr><th>Part No.</th><td><input type="text" id="partno2" readonly></td></tr>
</table>
</fieldset>
</form>
</body>
</html>