Asa Medlem sedan dec. 2001 1 860 inlägg Frågan 16 apr. 2014 21:27 #1 Jag har tre radioknappar och när jag väljer en sådan skall mitt formulär då välja vilken funktion som skall anropas i onsubmit. Vill ha så bara för att när jag väljer ett val kommer en div fram med olika fält.
Alltså väljer jag radioknapp nr 1 kommer 3 input fält fram med ex namn ett, tva och tre
Väljer jag knapp 2 kommer 2 fält fram med namnet fyra och fem.
Hoppas någon förstår hur jag vill göra och kan hjälpa mig :)
Asa Medlem sedan dec. 2001 1 860 inlägg Någon som förstår?
Här är min kod.
<script>
function validera1(){
if (document.form.falt1.value==""){
alert("Du glömde skriva text 1!");
return false;
}else if (document.form.falt2.value==""){
alert("Du glömde skriva text 2!");
return false;
}else if (document.form.falt3.value==""){
alert("Du glömde skriva text 3!");
return false;
}
}
function validera2(){
if (document.form.falt4.value==""){
alert("Du glömde skriva text 4!");
return false;
}else if (document.form.falt5.value==""){
alert("Du glömde skriva text 5!");
return false;
}else if (document.form.falt6.value==""){
alert("Du glömde skriva text 6!");
return false;
}
}
</script>
<form method="post" name="form" action="#" onSubmit="return valideraX()">
<script type="text/javascript">
$(document).ready(function () {
$('input[type=radio]').change(function(){
if ($('#choose1').is(':checked')) {
$('#show1').show();
$('#show2').hide();
} else {
$('#show1').hide();
}
if ($('#choose2').is(':checked')) {
$('#show1').hide();
$('#show2').show();
} else {
$('#show2').hide();
}
});
});
$("#choose1").prop("checked", true).change();
</script>
<input type="radio" name="typ" id="choose1" value="1"> DIV 1
<input type="radio" name="typ" id="choose2" value="2"> DIV 2
<div id="show1" style="display:none">
<strong>Text 1</strong><br /><input type="text" name="falt1"><br />
<strong>Text 2</strong><br /><input type="text" name="falt2"><br />
<strong>Text 3</strong><br /><input type="text" name="falt3">
</div>
<div id="show2" style="display:none">
<strong>Text 4</strong><br /><input type="text" name="falt4"><br />
<strong>Text 5</strong><br /><input type="text" name="falt5"><br />
<strong>Text 6</strong><br /><input type="text" name="falt6">
</div>
<input type="text" name="antal" value="1">
<input type="text" name="namn" value="Åsa">
<input type="submit" value="Spara">
</form>
Asa Medlem sedan dec. 2001 1 860 inlägg Ingen som kan och vill hjälpa mig?
kör en annan function för submit som kontrollera vilket värde din radio knapp ha, beroende på vilken det var kör den metod du vill köra.
Eller kan du använda dig av jquery och binder event och binder bort submit event när du gör en ändring.
skrev om markup:en lite du behöver inte gå mot id:n hela tiden ;)
<script>
$(document).ready(function () {
function validera1(){
if (this.falt1.value==""){
alert("Du glömde skriva text 1!");
return false;
}else if (this.falt2.value==""){
alert("Du glömde skriva text 2!");
return false;
}else if (this.falt3.value==""){
alert("Du glömde skriva text 3!");
return false;
}
}
function validera2(){
if (this.falt4.value==""){
alert("Du glömde skriva text 4!");
return false;
}else if (this.falt5.value==""){
alert("Du glömde skriva text 5!");
return false;
}else if (this.falt6.value==""){
alert("Du glömde skriva text 6!");
return false;
}
}
var show1 = $('#show1');
var show2 = $('#show2');
var form = $("#form");
$('input:radio[name="typ"]').change(function(){
var value = this.value;
show1.hide();
show2.hide();
form.off('.validate');
if(value == "1") {
show1.show();
form.on('submit.validate', validera1);
} else if(value == "2") {
show2.show();
form.on('submit.validate', validera2);
}
}).filter(':checked').trigger('change');
});
</script>
<form method="post" name="form" action="#" id="form">
<input type="radio" name="typ" value="1" checked> DIV 1
<input type="radio" name="typ" value="2"> DIV 2
<div id="show1" style="display:none">
<strong>Text 1</strong><br /><input type="text" name="falt1"><br />
<strong>Text 2</strong><br /><input type="text" name="falt2"><br />
<strong>Text 3</strong><br /><input type="text" name="falt3">
</div>
<div id="show2" style="display:none">
<strong>Text 4</strong><br /><input type="text" name="falt4"><br />
<strong>Text 5</strong><br /><input type="text" name="falt5"><br />
<strong>Text 6</strong><br /><input type="text" name="falt6">
</div>
<input type="text" name="antal" value="1">
<input type="text" name="namn" value="Åsa">
<input type="submit" value="Spara">
</form>
Asa Medlem sedan dec. 2001 1 860 inlägg Om jag har flera lika formulär på samma sida hur skriver jag då?
Asa skrev:
Om jag har flera lika formulär på samma sida hur skriver jag då?
är det det aktuella formuläret så kör istället:
$('input:radio[name="typ"]').change(function(){
var value = this.value;
var form = $(this.form);
show1.hide();
show2.hide();
form.off('.validate');
if(value == "1") {
show1.show();
form.on('submit.validate', validera1);
} else if(value == "2") {
show2.show();
form.on('submit.validate', validera2);
}
}).filter(':checked').trigger('change');
