Reputation:
I want to submit form without refreshing page and display success/error message under form, also in case of success reset form. But I guess, I am doing something wrong in ajax code, php works fine. Ajax:
$("#usignupform").validate({
submitHandler:function() {
var $form = $(form),
$messageSuccess = $('#mesSuccess'),
$messageError = $('#mesError');
$.ajax({
url: "investor-invite.php",
type: "POST",
data: $(this).serialize(),
complete: function(data) {
if (data.status == 'success') {
$messageSuccess.removeClass('hidden');
$messageError.addClass('hidden');
// Reset Form
$form.reset();
return;
} else {
$messageError.removeClass('hidden');
$messageSuccess.addClass('hidden');
}
}
});
return false;
}
});
PHP:
function NewUser(){
$data = mysql_query($query)or die(mysql_error());
if($data){
$response_array['status'] = 'success';
} else {
$response_array['status'] = 'error';
}
}
if(isset($_POST['submit'])){
NewUser();
}
HTML:
<form>
--all fields--
<button type="submit" name="submit" id="submitButton">
Request Invite</button>
<div class="alert alert-success hidden" id="mesSuccess">
<strong>Success!</strong> Your message has been sent to us.
</div>
<div class="alert alert-danger hidden" id="mesError">
<strong>Error!</strong> There was an error sending your message.
</div>
</form>
Upvotes: 0
Views: 2767
Reputation: 5166
you need to echo content on the php page then this will return success message .Ajax call will get the response if there is html or some printed data in the php file or any target file.
try like this
function NewUser(){
$data = mysqli_query($query)or die(mysql_error());
if($data){
$response_array['status'] = 'success';
}else {
$response_array['status'] = 'error';
}
return $response_array;
}
$data=NewUser();
echo json_encode($data);
and update the ajax function
$("#usignupform").validate({
submitHandler:function() {
var $form = $(form),
$messageSuccess = $('#mesSuccess'),
$messageError = $('#mesError');
$.ajax({
url: "investor-invite.php",
type: "POST",
data: $(this).serialize(),
dataType: 'json', //add this to get the json response
complete: function(data) {
if (data.status == 'success') {
$messageSuccess.removeClass('hidden');
$messageError.addClass('hidden');
// Reset Form
$form.reset();
return;
} else {
$messageError.removeClass('hidden');
$messageSuccess.addClass('hidden');
}
}
});
return false;
}
});
Update please remove Depricated mysql_* from your code and use mysqli_* or pdo queries
Upvotes: 1
Reputation: 234
Rather than using complete, use success. and if you want to be able to directly reference the name value pair then you will need to parse the data returned into json as your php currently only sends back the data as a string.
$.ajax({url:'investor-invite.php',
type:'POST',
success: function checkData(data){
dataObj = JSON.parse(data);
if(dataObj.status == success){
...
}
else{
...
}
}
});
Upvotes: 0
Reputation: 2965
Try This,
$.ajax({
type: "post",
url : "ajax.php",
dataType: 'json',
data:{ name : name,claass : claass,mobile : mobile},
success : function(data){
alert("success");
}
},"json");
in php,
$arr= ['fname'=>$name,'classs'=>$class,'mobile'=>$mobile];
echo json_encode($arr);
NB : Try With Your post variables. and array variables, I just coppy pasted my code for quick answer !!!!!!
Upvotes: 0
Reputation: 2705
where is the print statement and JSON Header
<?PHP
header('Content-Type: application/json');
echo json_encode($data);
Upvotes: 0