ik heb een probleem met een twee Radiobuttons in een formulier. Ik wil graag dat op de redirect pagina, de score uitslag verschijnt van de gekozen antwoorden. De originele functie werkt met een PHP POST (bron: http://css-tricks.com/building-a-simple-quiz/) maar in combinatie met mijn javascript bestand, krijg ik het niet werkend..
Heeft iemand een oplossing hierop?
Bedankt voor de moeite..
FORMULIER
<form id="ContactForm" action="">
<section class="st-panel" id="st-panel-2">
<div class="st-deco"></div>
<h2>Toelichting:<br />Neem plaats op de eerste tegel en wek energie op. Zodra de vraag op het scherm verschijnt, kiest u één van de vier volgende antwoorden.</h2>
<div class="sizer">
<label class="label_radio" for="vraag1_A"><input name="vraag1_antwoorden" id="vraag1_A" value="A" type="radio" />A) Geen eis</label>
<label class="label_radio" for="vraag1_B"><input name="vraag1_antwoorden" id="vraag1_B" value="B" type="radio" />B) 0,1 Ohm</label>
<label class="label_radio" for="vraag1_C"><input name="vraag1_antwoorden" id="vraag1_C" value="C" type="radio" />C) 1 Ohm</label>
<label class="label_radio" for="vraag1_D"><input name="vraag1_antwoorden" id="vraag1_D" value="D" type="radio" />D) 10 Ohm</label>
</div>
<span id="vraag1_antwoorden" class="foutmelding_antwoorden" style="display:none;"></span>
</section>
<input type="button" class="button_verzenden black" id="send" value="VERSTUUR" /><input type="hidden" id="newcontact" name="newcontact" value="1"></input></form>
JAVASCRIPT VOOR VERZENDEN MAIL, DATABASE TOEVOEGING
$(document).ready(function() {
contact.initEventHandlers();
});
var contact = {
initEventHandlers : function() {
/* clicking the submit form */
$('#send').bind('click',function(event){
$('#loader').show();
setTimeout('contact.ContactFormSubmit()',500);
});
/* remove messages when user wants to correct (focus on the input) */
$('.inplaceError,.foutmelding_antwoorden',$('#ContactForm')).bind('focus',function(){
var $this = $(this);
var $error_elem = $this.next();
if($error_elem.length)
$error_elem.fadeOut(function(){$(this).empty()});
$('#success_message').empty();
});
/* user presses enter - submits form */
$('#ContactForm input,#ContactForm textarea').keypress(function (e) {
if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
$("#send").click();
return false;
}
else
return true;
});
},
ContactFormSubmit : function() {
$.ajax({
type : 'POST',
url : 'php/contact.php?ts='+new Date().getTime(),
dataType : 'json',
data : $('#ContactForm').serialize(),
success : function(data,textStatus){
//hide the ajax loader
$('#loader').hide();
if(data.result == '1'){
//show success message
$('#midden').remove();
window.location = "result.php"
}
else if(data.result == '-1'){
for(var i=0; i < data.errors.length; ++i ){
if(data.errors[i].value!='') {
var elm = $("#"+data.errors[i].name);
// we gaan kijken welk soort element elm is.
// wanneer dat element een span is, moeten we geen nieuwe span meer aanmaken...
switch (elm[0].tagName.toLowerCase()) {
case 'span':
elm.html(data.errors[i].value).fadeIn();
break;
default:
elm.next().html('<span class="foutmelding_antwoorden">'+data.errors[i].value+'</span>').fadeIn();
break;
}
}
$("#"+data.errors[i].name).next().html('<span class="foutmelding_antwoorden">'+data.errors[i].value+'</span>').fadeIn();
}
}
},
error : function(data,textStatus){}
});
}
};
- Ik probeer mijn score uitslag te tonen op de result pagina
- Het formulier neemt de waarde niet mee naar de result pagina omdat er geen POST functie aan gekoppeld zit. Zodra ik dit doe, moet ik mijn button veranderen naar een submit knop, maar dan werkt mijn javascript niet meer die de data mailt en in een database plaatst..
- Ik heb al geprobeerd: Form action naar result.php en method:post > mailing en database plaatsing werkt niet meer;
- Submit knop verbergen achter de normale knop;
- PHP integreren in het javascript bestand, zonder enig succes.
- Dus mijn vraag is, hoe kan ik de score uitslag (POST FUNCTIE) in mijn javascript bestand hierboven meenemen?
Je kunt de gegevens toch gewoon POSTen naar result.php en daar een mail (advies: swiftmailer of phpmailer) versturen en gegevens invoeren in db? Zou dat niet met javascript doen.
Ten aanzien van je result code:
Waarom kopiëren van variabelen (regel 7+8)?
Je echo: gebruik ' zodat je in HTML " kunt gebruiken. Daarnaast horen variabelen buiten quotes.
Op dit moment hanteer ik onderstaande contact.php voor de afhandeling van de mail en database. Waarin zie je dan die POST functie staan zodat deze getoond wordt op result.php?
Ik ga mee met wat Obelix zegt. Waarom zou je eerst alle info via een Ajax submit willen doen en dan ook nog een submit via een normale POST. Dat is dubbelop. Je moet dan twee keer verbinding maken met je server, terwijl het in 1 keer kan. Ik zie dus twee (logische) oplossingen:
1) form op normale manier submitten en serverside zowel het form behandelen als het resultaat opmaken
2) form submitten via Ajax en na een succes melding van de server via javascript je form hidden en een succes div tonen. Op die manier hoef je dus ook geen tweede submit te doen.
Je echo: gebruik ' zodat je in HTML " kunt gebruiken. Daarnaast horen variabelen buiten quotes.
Dat geldt ook voor het toekennen van een waarde aan een variabele.
Overigens; inline css is eigenlijk niet meer van deze tijd.
<?php
$email_verzender = ''.$email.'';
?>
Waarom die quotes voor en na de variabele?
Je kunt toch gewoon
<?php
$email_verzender = $email;
?>doen?
Overigens: ook nu is het weer kopiëren van variabele en dus overbodig.
Ik ga mee met wat Obelix zegt. Waarom zou je eerst alle info via een Ajax submit willen doen en dan ook nog een submit via een normale POST. Dat is dubbelop. Je moet dan twee keer verbinding maken met je server, terwijl het in 1 keer kan. Ik zie dus twee (logische) oplossingen:
1) form op normale manier submitten en serverside zowel het form behandelen als het resultaat opmaken
2) form submitten via Ajax en na een succes melding van de server via javascript je form hidden en een succes div tonen. Op die manier hoef je dus ook geen tweede submit te doen.
Hee Erik, ik zou het graag via manier 2 willen oplossen. Dus het form submitten zoals het nu gaat, anders ben ik bang dat ik teveel overhoop moet halen. De succes div en het verbergen van de form werkt. Echter ik zou graag in de succes div de ingevulde waarden uit het formulier en de score uitslag van de twee radio buttons willen zien.
Hoe doe ik dit?