user4666065
user4666065

Reputation:

Ajax success message is not working

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

Answers (4)

Manoj Dhiman
Manoj Dhiman

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

MuppetGrinder
MuppetGrinder

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

Jishad
Jishad

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

Osama Jetawe
Osama Jetawe

Reputation: 2705

where is the print statement and JSON Header

<?PHP
header('Content-Type: application/json');
echo json_encode($data);

Upvotes: 0

Related Questions