codetoad.com
  ASP Shopping CartForum & BBS
  - all for $20 from CodeToad Plus!
  
  Home || ASP | ASP.Net | C++/C# | DHTML | HTML | Java | Javascript | Perl | VB | XML || CodeToad Plus! || Forums || RAM 
Search Site:
Search Forums:
  Execute javascript function based on selected dropdown list value.  TKOEHN5751 at 18:58 on Wednesday, February 25, 2004
 

I would like to use a dropdown list that would execute a different javascript funtion based on the value the user selected.

My first goal is if 1,2,3,4,or 5 is chosen the second field(named "Eway") appears. If 0 is chosen the field disappears.

My second goal is if the 2nd field is visable it needs to be required, when it is not visible it should NOT be required.

Here is what I've got so far...

<SCRIPT>
function yes() {
MMDiv.style.visibility='visible';
mainform.MakeModel.focus();
}</SCRIPT>
<SCRIPT>
function no() {
MMDiv.style.visibility='hidden';
mainform.MakeModel.focus();
}</SCRIPT>

<table width="292" align=center cellpadding=0 cellspacing=1 bgcolor=A4C0DD border=1><tr><td colspan="8">
<table border="0" align="center"><tr>

<td height=10 width="50"><B>Card 1</td>

<td>Qty
<select class=d type=text name=qty1 size=1 onchange="yes()">
<option selected value="0"></option>
<option onchange=yes() value="1">1 box of 250</option>
<option value="2">2 boxes of 250</option>
<option value="3">3 boxes of 250</option>
<option value="4">4 boxes of 250</option>
<option value="5">5 boxes of 250</option>
</td>

<td>
<DIV ID="MMDiv" style="visibility:hidden">
<LABEL FOR="MakeModel">Eway # <INPUT TYPE="TEXT" class="d" ID="MakeModel" name="requiredeway1" size="6">
</LABEL>
</DIV>
</td>

</tr></table>
</td></tr></table>



  Re: Execute javascript function based on selected dropdown list value.  Troy Wolf at 01:29 on Thursday, February 26, 2004
 

Here you go. Copy & Paste this into a new HTML document to test.
<SCRIPT language=javascript>
function toggleElement(e) {
e = document.getElementById(e);
if (form1.qty1.value == 0) {
e.style.visibility='hidden';
} else {
e.style.visibility='visible';
form1.MakeModel.focus();
}
}
function SubmitTrigger()
{
if (form1.qty1.value > 0) {
if (!form1.MakeModel.value) {
alert("Eway # is required");
return false;
}
}
return true;
}
function LoadTrigger() {
toggleElement('divMakeModel');
}
window.onload = LoadTrigger;
</SCRIPT>

<table width="292" align=center cellpadding=0 cellspacing=1 bgcolor=A4C0DD border=1><tr><td colspan="8">
<form name=form1 onsubmit="return SubmitTrigger();">
<table border="0" align="center"><tr>

<td height=10 width="50"><B>Card 1</td>

<td>Qty
<select class=d type=text name=qty1 size=1 onchange="toggleElement('divMakeModel')">
<option selected value="0">Select an option</option>
<option value="1">1 box of 250</option>
<option value="2">2 boxes of 250</option>
<option value="3">3 boxes of 250</option>
<option value="4">4 boxes of 250</option>
<option value="5">5 boxes of 250</option>
</td>
<td>
<div id="divMakeModel">
Eway # <INPUT TYPE="TEXT" ID="MakeModel" name="MakeModel" size="6">
</div>
</td>
<td>
<br>
<input type=submit value="go">
</td>
</tr></table>
</form>
</td></tr></table>
Troy Wolf: site expert
Shiny Solutions









CodeToad Experts

Can't find the answer?
Our Site experts are answering questions for free in the CodeToad forums








Recent Forum Threads
•  Re: onload event
•  Active Widgets
•  Re: onmouseover change image and text
•  Line Printer Interface
•  import contacts of msn/yahoo
•  Call windows apps from web apps
•  Re: ASP.NET web controls
•  netscape 6 browser problem
•  Re: Print .doc file from the website using System.Diagnostics.Process


Recent Articles
Communicating with the Database (Using ADO)
MagicGrid
Simple Thumbnail Browsing Solution
Type Anywhere
A Better Moustrap: FmtDate to replace FormatDateTime
ASP.NET Forum Source Code
Internal Search Engine
Javascript Growing Window
Simple date validation
Search engine friendly URLs using ASP.NET (C#.NET)


Site Survey
Help us serve you better. Take a five minute survey. Click here!

© Copyright codetoad.com 2001-2005