Dynamic Select List

[Total: 0    Average: 0/5]

This is the final version of dynamical select list

Head Code:

 <script type=text/javascript>
function hideandshow(whichID,whichItem) 
{
if (document.all) 
{ // is IE
if (whichItem=='Test1') 
eval("document.all."+whichID+".style.visibility='visible';");
else
eval("document.all."+whichID+".style.visibility='hidden';");
} 
else 
{ // is NS? -- just guessing for this simple example...
if (whichItem=='Test1') 
eval("document.layers['"+whichID+"'].visibility='show';");
else
eval("document.layers['"+whichID+"'].visibility='hide';");
}
}
function ValidateFields(selected)
{
var selectvalue;
if ( selected =="")
{
alert ("Please select a value");
return false;
}
else
{   if (selected == "Test1")
{
if (document.layers)
{
if (document.layers[0].document.hideform.type1.options[document.layers[0].document.hideform.type1.selectedIndex].value=="")
{
alert ("Please select a value for this field");
return false;
}
else
{
selectvalue=document.layers[0].document.hideform.type1.options[document.layers[0].document.hideform.type1.selectedIndex].value;
document.selectiontest.selectvalue.value=selectvalue;
}
}
else
{
if (document.hideform.type1.options[document.hideform.type1.selectedIndex].value=="")
{
alert ("Please select a value for this field");
return false;
}
else
{
selectvalue=document.hideform.type1.options[document.hideform.type1.selectedIndex].value;
document.selectiontest.selectvalue.value=selectvalue;
}
}
}

document.selectiontest.submit(); 
}
return true;
}
</script>
</head>

Body Code:

<span id="dyn" style="visibility:hidden;position:absolute;top:37;left:250">
<form name="hideform" action="javascript:#">
<select name="type1" size=1>
<option value="">Select what you want</option>
<option value="a1">test1</option>
</select>
</form>
</span>

<form name="selectiontest" action="http://www.js-examples.com/" method="post">
<table>
<tr><Td>&nbsp;</td></tr>
<tr>
<td>Select test</td>
 <td><select name="test" size=1 
 onChange="hideandshow('dyn',document.selectiontest.test.options[document.selectiontest.test.selectedIndex].value)">
   <option value="">select what you want</option>
    <option value="Test1">Test1</option>
<option value="Test2">Test2</option>
   </select>
  </td>    
 </tr>
<tr><td>&nbsp;</td></tr>


<tr>
    <td>&nbsp;</td>
<td><input type="button" value="Save" name="txtSubmit" onClick="ValidateFields(document.selectiontest.test.options[document.selectiontest.test.selectedIndex].value)">&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="reset" value="Cancel" name="txtCancel">
</td>

</tr> 
</table>  
<input type="hidden" name="selectvalue">
</form>

Times Viewed: 0

Leave a Reply

Your email address will not be published. Required fields are marked *