Showing posts with label dynamic forms. Show all posts
Showing posts with label dynamic forms. Show all posts

Sunday, March 9, 2014

load dynamic forms based on drop down selected by user

hi,
well there are many ways of doing this. i have done it the following way:-
HTML
<div id="spc">
<select id="selectform" onChange="selfo();">
<option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>  
</select>
      <form id="abc" style="display:none">
      <input>
      </form>
      <form id="def" style="display:none">
      <input><input>
      </form>
      <form id="ghi" style="display:none">
      <input><input><input>
      </form>
      </div>

//javascript
    <script>
function selfo()
{
var a = document.getElementById("selectform").value;
if(a == 1){
document.getElementById("abc").style.display = "block";
document.getElementById("def").style.display = "none";
document.getElementById("ghi").style.display = "none";
}
else if(a == 2){
document.getElementById("def").style.display = "block";
document.getElementById("abc").style.display = "none";
document.getElementById("ghi").style.display = "none";
}
else if(a == 3){
document.getElementById("ghi").style.display = "block";
document.getElementById("abc").style.display = "none";
document.getElementById("def").style.display = "none";
}
else if(a == 0){
document.getElementById("spc").style.display = "none";
}
}
    </script>