Thank you Friend.Another think i want to ask is when i click the link the table is displayed and other links were hidden if i want to click the next link i have to refresh the page instead i want to do is when i click the link the table should display and again when i click the link the table should not display
Hello Friend,
Try this:
<html> <script> function fun1(h) { var tbl = document.getElementById('div1'); tbl.style.display = h; document.getElementById('link2').style.visibility='hidden'; document.getElementById('link3').style.visibility='hidden'; } function fun2(h) { var tbl = document.getElementById('div2'); tbl.style.display = h; document.getElementById('link1').style.visibility='hidden'; document.getElementById('link3').style.visibility='hidden'; } function fun3(h) { var tbl = document.getElementById('div3'); tbl.style.display = h; document.getElementById('link1').style.visibility='hidden'; document.getElementById('link2').style.visibility='hidden'; } function func(){ window.location.reload(); } </script> <p><br> <a id="link1" href="javascript:fun1('block')" onDblClick="func()">Show1</a></p> <div id=div1 name=div1 style="overflow:hidden;display:none"> <center><h2>Personal Details:</h2></center> <form name="form" method="post" onsubmit="return validate();"> <center> <table> <tr><td>First Name:</td><td><input type="text" name="fname"></td></tr> <tr><td>Last Name:</td><td><input type="text" name="lname"></td></tr> <tr><td>Date Of Birth:</td><td><input type="text" name="dob"></td></tr> </table> </div> <p><br> <a id="link2" href="javascript:fun2('block')" onDblClick="func()" >Show2</a></p> <div id=div2 name=div2 style="overflow:hidden;display:none"> <center><h2>Contact Details:</h2></center> <center> <table> <tr><td>Address:</td><td><input type="text" name="address"></td></tr> <tr><td>Contact No:</td><td><input type="text" name="contact"></td></tr> <tr><td>Email:</td><td><input type="text" name="email"></td></tr> </table> </center> </div> <p><br> <a id="link3" href="javascript:fun3('block')" onDblClick="func()">Show3</a></p> <div id=div3 name=div3 style="overflow:hidden;display:none"> <center><h2>Qualification:</h2></center> <center> <table> <tr><td>Highest Qualification(With University):</td><td><input type="text" name="qua1"></td></tr> <tr><td>Second Highest Qualification(With University:</td><td><input type="text" name="qua2"></td></tr> </table> </form> </center> </div> </div> </html>
Thanks
Hi Friend,
Try this:
<html> <script> function fun1(h) { var tbl = document.getElementById('div1'); tbl.style.display = h; document.getElementById('link2').style.visibility='hidden'; document.getElementById('link3').style.visibility='hidden'; } function fun2(h) { var tbl = document.getElementById('div2'); tbl.style.display = h; document.getElementById('link1').style.visibility='hidden'; document.getElementById('link3').style.visibility='hidden'; } function fun3(h) { var tbl = document.getElementById('div3'); tbl.style.display = h; document.getElementById('link1').style.visibility='hidden'; document.getElementById('link2').style.visibility='hidden'; } function func(){ window.location.reload(); } </script> <br> <a id="link1" href="javascript:fun1('block')" onDblClick="func()">Show1</a> <div id=div1 name=div1 style="overflow:hidden;display:none"> <center><h2>Personal Details:</h2></center> <form name="form" method="post" onsubmit="return validate();"> <center> <table> <tr><td>First Name:</td><td><input type="text" name="fname"></td></tr> <tr><td>Last Name:</td><td><input type="text" name="lname"></td></tr> <tr><td>Date Of Birth:</td><td><input type="text" name="dob"></td></tr> </table> </div> <br> <a id="link2" href="javascript:fun2('block')" onDblClick="func()" >Show2</a> <div id=div2 name=div2 style="overflow:hidden;display:none"> <center><h2>Contact Details:</h2></center> <center> <table> <tr><td>Address:</td><td><input type="text" name="address"></td></tr> <tr><td>Contact No:</td><td><input type="text" name="contact"></td></tr> <tr><td>Email:</td><td><input type="text" name="email"></td></tr> </table> </center> </div> <br> <a id="link3" href="javascript:fun3('block')" onDblClick="func()">Show3</a> <div id=div3 name=div3 style="overflow:hidden;display:none"> <center><h2>Qualification:</h2></center> <center> <table> <tr><td>Highest Qualification(With University):</td><td><input type="text" name="qua1"></td></tr> <tr><td>Second Highest Qualification(With University:</td><td><input type="text" name="qua2"></td></tr> </table> </form> </center> </div> </div> </html>
Thanks