javascript - Populating the form with default values on click of radio buttons -
i have form 3 radio buttons , 3 text boxes , on click of radio button 1 input field shows , other 2 hides (using jquery). wish submit form filling 2 hidden fields default values , have tried assign values 2 hidden fields didn't worked ,
please me , here's have tried till know , unable assign values hidden text field .
$(document).ready(function(){ $('input[type="radio"]').click(function(){ if($(this).attr("value")=="red"){ $(".box").hide(); $(".red").show(); } if($(this).attr("value")=="green"){ $(".box").hide(); $(".green").show(); } if($(this).attr("value")=="blue"){ $(".box").hide(); $(".blue").show(); } }); });
.box{ padding: 20px; display: none; margin-top: 20px; border: 1px solid #000; } .red{ background: #ff0000; } .green{ background: #00ff00; } .blue{ background: #0000ff; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <label><input type="radio" name="colorradio" value="red"> red</label> <label><input type="radio" name="colorradio" value="green"> green</label> <label><input type="radio" name="colorradio" value="blue"> blue</label> </div> <form id="myform"> <div class="red box"> <input type="text" > </div> <div class="green box"><input type="text" ></div> <div class="blue box"><input type="text" ></div> <input type="submit"> </form>
as far know when form element set display: none
, can't capture value when submit form. should hide them in different way don't use display: none
.
Comments
Post a Comment