<form name="form" action="" method="post">
<input type='radio' value="rawmaterial" name='material' class="dynamic_class">Transfer
<input type='radio' value="salaryaccount" name='material' class="dynamic_class">cheque
<div id="tran">
<div class="form-group input-group">
<span class="input-group-addon">transfer id</span>
<input type="text" name="transfer_id" id="transfer_id" class="form-control"> </div> </div>
<div id="transs">
<div class="form-group input-group">
<span class="input-group-addon">cheque number</span>
<input type="text" name="cheque_no" id="cheque_no" class="form-control"> </div> </div>
<button type='submit' name="submit" onclick="validate(event, this.form);" value="validate">submit</button>
</form>
<script>function validate(e, form) {
var material = form.querySelectorAll('input[name="material"]:checked');
var transfer_id=document.forms["form"]["transfer_id"].value
var cheque_no=document.forms["form"]["cheque_no"].value
if (!material.length ) {
alert('please select fundsource or material source');
e.preventDefault();
return false;
}
if (form.material[0].checked != '' && !transfer_id.length ) {
alert('please select transfer_id');
e.preventDefault();
return false;
}
if (form.material[1].checked != '' && !cheque_no.length)
{ alert('please select cheque no');
e.preventDefault();
return false;
}
}</script>
<style> #tran{ display: none; }#transs{ display: none; }</style>
<script src="http://code.jquery.com/jquery.js"></script>
<script>
$(function(){
$(".dynamic_class").click(function(){
if($(this).val() === "rawmaterial")
$("#tran").show("fast");
if($(this).val() === "salaryaccount")
$("#transs").show("fast");
if($(this).val() === "rawmaterial")
$("#transs").hide("fast");
if($(this).val() === "salaryaccount")
$("#tran").hide("fast");
});
});</script>
demo:
<input type='radio' value="rawmaterial" name='material' class="dynamic_class">Transfer
<input type='radio' value="salaryaccount" name='material' class="dynamic_class">cheque
<div id="tran">
<div class="form-group input-group">
<span class="input-group-addon">transfer id</span>
<input type="text" name="transfer_id" id="transfer_id" class="form-control"> </div> </div>
<div id="transs">
<div class="form-group input-group">
<span class="input-group-addon">cheque number</span>
<input type="text" name="cheque_no" id="cheque_no" class="form-control"> </div> </div>
<button type='submit' name="submit" onclick="validate(event, this.form);" value="validate">submit</button>
</form>
<script>function validate(e, form) {
var material = form.querySelectorAll('input[name="material"]:checked');
var transfer_id=document.forms["form"]["transfer_id"].value
var cheque_no=document.forms["form"]["cheque_no"].value
if (!material.length ) {
alert('please select fundsource or material source');
e.preventDefault();
return false;
}
if (form.material[0].checked != '' && !transfer_id.length ) {
alert('please select transfer_id');
e.preventDefault();
return false;
}
if (form.material[1].checked != '' && !cheque_no.length)
{ alert('please select cheque no');
e.preventDefault();
return false;
}
}</script>
<style> #tran{ display: none; }#transs{ display: none; }</style>
<script src="http://code.jquery.com/jquery.js"></script>
<script>
$(function(){
$(".dynamic_class").click(function(){
if($(this).val() === "rawmaterial")
$("#tran").show("fast");
if($(this).val() === "salaryaccount")
$("#transs").show("fast");
if($(this).val() === "rawmaterial")
$("#transs").hide("fast");
if($(this).val() === "salaryaccount")
$("#tran").hide("fast");
});
});</script>
demo:
No comments:
Post a Comment