How to display another form on select of button
I cre开发者_StackOverflow中文版ated jsp which has 2 forms. In UI there are 2 buttons. On select of each button respective form should be displayed. But while trying to do this its not allowing me to display other form on button click. Any sample code such to solve my problem?
I created example code to do show and hide forms as you explained. Check whether this is the solution for your problem.
<html>
<head>
<script langauge="javascript">
function showForm1(){
document.getElementById('form1').style.display="block";
document.getElementById('form2').style.display="none";
}
function showForm2(){
document.getElementById('form2').style.display="block";
document.getElementById('form1').style.display="none";
}
</script>
</head>
<body>
<div id="form1" name="form1">
<h1> Form 1 </h1>
<form id="frm1" name="frm1">
Form 1 text 1 <input type="text" id="frm1txt1" name="frm1txt1"/> <br>
Form 1 text 2 <input type="text" id="frm1txt2" name="frm1txt2"/> <br>
<input type="submit" id="frm1btn1" name="frm1btn1" value="submit"/> <br>
</form>
</div>
<div id="form2" name="form2" style="display:none">
<h1> Form 2 </h1>
<form id="frm2" name="frm2">
Form 2 text 1 <input type="text" id="frm2txt1" name="frm2txt1"/> <br>
Form 2 text 2 <input type="text" id="frm2txt2" name="frm2txt2"/> <br>
<input type="submit" id="frm2btn1" name="frm2btn1" value="submit"/> <br>
</form>
</div>
<div id="form1" name="form1">
<h1> Show/Hide buttons </h1>
<form id="ctrl" name="ctrl">
<input type="button" id="ctrlbtn1" name="ctrlbtn1" value="Show form 1" onclick="showForm1();"/>  
<input type="button" id="ctrlbtn2" name="ctrlbtn2" value="Show form 2" onclick="showForm2();"/> <br>
</form>
</div>
</body>
</html>
精彩评论