I''m trying to process a form without page reload using jQuery post as shown below:
<script type="text/javascript">
$('#settingsForm').submit( function(){ $('input[type=submit]', this).attr('disabled', 'disabled ');});
function scheck(){
var oldanswer = $("#oldanswer");
var newquestion = $("#newquestion");
var newanswer = $("#newanswer");
var url = "settingsupdate.php";
//This part of the code works fine. Errors are displayed normally
if(oldanswer.val() == ""){
$('#output').html('Oops you left a field empty. Please fill it').show().fadeOut(6000);
}
else if (newquestion.val() == ""){
$('#output').html('Oops you left a field empty. Please fill it').show().fadeOut(6000);
}
else if (newanswer.val() == ""){
$('#output').html('Oops you left a field empty. Please fill it').show().fadeOut(6000);
}
else{
$('#FormProcessor').show();
$.post(url,{oldans: oldanswer.val(), newquest: newquestion.val(), newans: newanswer.val()}, function (data){
$("#security_check").slideup("fast");
$("#output").html(data).show().fadeOut(10000);
document.settingsForm.oldanswer.value = "";
document.settingsForm.newquestion.value = "";
document.settingsForm.newanswer.value = "";
$('#FormProcessor').hide();
});
}
}
</script>
settingsupdate.php (simplified)
if(isset($_POST['submitset'])){ //the submit button
$oldans = htmlspecialchars($_POST['oldans']);
$newquest = htmlspecialchars($_POST['newquest']);
$newans = htmlspecialchars($_POST['newans']);
echo $oldans;
}
When i submit the form, the processor image appears ($('#FormProcessor').show();) and nothing happens. The page just remains static. Nothing is echoed from the php script back to the page. The check for empty fields as shown above however, works normally, which means the form is posted but the jQuery post call isn't working. What's my error?