I have a drop down with yes and no option.if i select yes in a table 2 new rows are shown and if i select no another question in row appears but the space occupied by the question of yes option are still appearing in the form which should be eliminated Please help
Please post your code.
<script language="JavaScript" type="text/javascript"> <!-- show hide Working/Surrendered Date function ShowTB(obj,id1,id2,id3,id4,id5,id6,id7,id8,id9,id10,id11) { txt=obj.options[obj.selectedIndex].text; if (txt.match('No')) { document.getElementById(id1).style.visibility='hidden'; document.getElementById(id2).style.visibility='hidden'; document.getElementById(id3).style.visibility='hidden'; document.getElementById(id4).style.visibility='hidden'; document.getElementById(id5).style.visibility='hidden'; document.getElementById(id6).style.visibility='hidden'; document.getElementById(id7).style.visibility='hidden'; document.getElementById(id8).style.visibility='hidden'; document.getElementById(id9).style.visibility='hidden'; document.getElementById(id10).style.visibility='visible'; document.getElementById(id11).style.visibility='visible'; } if (txt.match('Yes')) { document.getElementById(id1).style.visibility='visible'; document.getElementById(id2).style.visibility='visible'; document.getElementById(id3).style.visibility='visible'; document.getElementById(id4).style.visibility='visible'; document.getElementById(id5).style.visibility='visible'; document.getElementById(id6).style.visibility='visible'; document.getElementById(id7).style.visibility='visible'; document.getElementById(id8).style.visibility='visible'; document.getElementById(id9).style.visibility='visible'; document.getElementById(id10).style.visibility='hidden'; document.getElementById(id11).style.visibility='hidden'; } } //--> </script> <script language="JavaScript" type="text/javascript"> <!-- show hide Working/Surrendered Date function Show(obj,id1,id2,id3) { txt=obj.options[obj.selectedIndex].text; if (txt.match('Yes')) { document.getElementById(id1).style.visibility='hidden'; document.getElementById(id2).style.visibility='hidden'; document.getElementById(id3).style.visibility='hidden'; } if (txt.match('No')) { document.getElementById(id1).style.visibility='visible'; document.getElementById(id2).style.visibility='visible'; document.getElementById(id3).style.visibility='visible'; } } //--> </script> </head> <table> <tr> <td colspan="5" bgcolor="#990000" align="center" ><font color="white"></font><B>Network Equipments Availability</B></td> </tr> <tr align="center" > <th colspan="2.5"><Font color="Red">*</Font><b>Is there a router available at the site :</b></th> <th colspan="2.5"> <select name="router" onchange="ShowTB(this,'fred1','fred2','fred3','fred4','fred5','fred6','fred7','fred8','fred9','fred10','fred11');"> <option value="-1">Select</option> <option value="Yes">Yes</option> <option value="No">No</option> </select> </th> </tr> <tr> <th id="fred1" colspan="5" bgcolor="#990000" style="visibility:hidden;" align="center" ><font color="white"></font><B>Give the following Details</B></th> </tr> <tr> <th id="fred2" align="left" bgcolor="#CCCCCC" style="visibility:hidden;" ><Font color="Red">*</Font><b>Mark</b></th> <td> <input id="fred3" style="visibility:hidden;" type="text" name="mark" size="30" ></td> <th id="fred4" align="left" bgcolor="#CCCCCC" style="visibility:hidden;" ><Font color="Red">*</Font><b>Model</b></th> <td> <input id="fred5" style="visibility:hidden;" type="text" name="model" size="30" ></td> </tr> <tr> <th id="fred6" align="left" bgcolor="#CCCCCC" style="visibility:hidden;" ><Font color="Red">*</Font><b>Sr no</b></th> <td> <input id="fred7" style="visibility:hidden;" type="text" name="sr no" size="30" ></td> <th id="fred8" align="left" bgcolor="#CCCCCC" style="visibility:hidden;" ><Font color="Red">*</Font><b>Accesories/Card</b></th> <td> <input id="fred9" style="visibility:hidden;" type="text" name="card" size="30" ></td> </tr> <tr align="center" > <th id="fred10" align="center" colspan="2.5" bgcolor="#CCCCCC" style="visibility:hidden;" ><Font color="Red">*</Font><b>Does a new Router is required to be processed:</b></th> <td id="fred11" colspan="2.5" align="left" bgcolor="#CCCCCC" style="visibility:hidden;" > <select name="info" onchange="Show(this,'fred12','fred13');" > <option value="-1">Select</option> <option value="Yes">Yes</option> <option value="No">No</option> </select> </td> </tr> <tr align="center" > <th id="fred12" align="center" bgcolor="#CCCCCC" colspan="2.5" style="visibility:hidden;" ><Font color="Red">*</Font><b>Is the Router made available from existing stock:</b></th> <td id="fred13" align="left" bgcolor="#CCCCCC" style="visibility:hidden;"colspan="2.5" > <select name="stock" > <option value="-1">Select</option> <option value="Yes">Yes</option> <option value="No">No</option> </select> </td> </tr> <tr> <td align="center"colspan="2.5" bgcolor="#CCCCCC" text="italic"><Font color="Red">*</Font><b>Any Router Acessories needs to be procured?</b></th> <td colspan="2.5"> <input type="text" name="Acc" size="48" style="background-color:#FFFFCC;"> </td> </tr> </table>
if i select yes ,then 3 rows appears and occupy the space. if i select no, then question for no appears but the space for 3 row is jst hidden and a long gap appears between the question. plz run the code and see result and plz help me thanks
Please give me the solution soon..Its urgent thanks
Ads