Не получая ajax об успешном ответе используя mamp

Question

По какой-то причине я не получаю ответ от вызова AJAX.Я использовал консоль в Chrome и Firefox для мониторинга этого, но все, что я вижу, это отправка формы.Я использую MAMP и не пробовал это на живом сервере, но мне нужно, чтобы он работал в MAMP.Я пробовал много вещей, которые люди предлагали по аналогичным проблемам, которые я нашел в stackoverflow, но известные работали, пожалуйста, помогите!

<form id="signup_submit" method="post" action="AJAX/signup.php">
                    <div class="form-group show-progress">

                    </div>
        <div class="form-group">
                    <input type="text" name="firstname" id="firstname" class="form-control" autocomplete="firstname" placeholder="Enter First Name...">
                    <span class="firstname-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                    <input type="text" name="surname" autocomplete="surname" id="surname" class="form-control" placeholder="Enter Surname...">
                    <span class="surname-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="email" name="email" id="email" autocomplete="email"  class="form-control" placeholder="Enter Email...">
                        <span class="email-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="password" name="password" autocomplete="password"  id="password" class="form-control" placeholder="Choose Password...">
                        <span class="password-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="password" id="confirm" name="confirm" autocomplete="confirm"  class="form-control" placeholder="Confirm Password...">
                        <span class="confirm-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <button type="submit" id="submit" >Create Account</button>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <a href="#" id="login">Already have an account?</a>
                    </div>
                </form><!-- form -->

signup.js

    $(document).ready(function(){
    $('form').submit(function(e){
        e.preventDefault();
        var data = $('#signup_submit').serialize();
        console.log(data)
        $.ajax({
            type:'POST',
            URL: 'AJAX/signup.php',
            data: data,
            dataType: 'json',
            encode:true,
            success: function(d){
                d = JSON.parse(d);
                console.log(d.testjson);
                if(d.success){
                    $('#signup_submit').append('<div>'+d.message+'</div>');
                }else{
                    if(d.errors.firstname){$('.firstname-error').show();$('.firstname-error').html(d.errors.firstname);}
                    if(d.errors.surname){$('.surname-error').show();$('.surname-error').html(d.errors.surname);}
                    if(d.errors.email){$('.email-error').show();$('.email-error').html(d.errors.emailname);}
                    if(d.errors.password){$('.password-error').show();$('.password-error').html(d.errors.password);}
                    if(d.errors.confirm){$('.confirm-error').show();$('.confirm-error').html(d.errors.confirm);}
                }
            }
        })
    })

})

signup.php

<?php 
$errors = array();
$response = array();

if(empty($_POST['firstname'])){$errors['firstname'] = 'First Name Is Required!';}
if(empty($_POST['surname'])){$errors['surname'] = 'Surname Is Required!';}
if(empty($_POST['email'])){$errors['email'] = 'Email Address Is Required!';}
if(empty($_POST['password'])){$errors['password'] = 'Password Is Required!';}
if(empty($_POST['confirm'])){$errors['confirm'] = 'Please Confirm Your Password!';}

$response['errors'] = $errors;

if (!empty($errors)){

    $response['success'] = false;
    $response['message'] = 'FAIL!';
}else{
    $response['success'] = true;
    $response['message'] = 'SUCCESS!';  

}



 ?>  

Answer 1

Удалите dataType: 'json' и попробуйте.Также установите заголовок перед выводом результата, как показано ниже:

header('Content-type:application/json');
echo json_encode($response);

Answer 2

Вы никогда ничего не возвращаете в файле signup.php.Вам нужно json_encode и использовать echo или exit в конце вашего скрипта.

---

<?php

$errors = array();
$response = array();

if (empty($_POST['firstname'])) $errors['firstname'] = 'First Name Is Required!';
if (empty($_POST['surname'])) $errors['surname'] = 'Surname Is Required!';
if (empty($_POST['email'])) $errors['email'] = 'Email Address Is Required!';
if (empty($_POST['password'])) $errors['password'] = 'Password Is Required!';
if (empty($_POST['confirm'])) $errors['confirm'] = 'Please Confirm Your Password!';

$response['errors'] = $errors;

if (!empty($errors)) {
    $response['success'] = false;
    $response['message'] = 'FAIL!';
} else {
    $response['success'] = true;
    $response['message'] = 'SUCCESS!';
}

// Return data here
exit(json_encode($response));

?>

---

Редактировать : сохранить PHP exit сверху, но вместо этого используйте jQuery.post () вместо jQuery.ajax(), так как он короче, чище и проще, чем возиться с типами контента.Это также должно исправить вашу проблему:

$(document).ready(function(){
    $('form').submit(function(e) {
        e.preventDefault();
        var data = $('#signup_submit').serialize();

        console.log("data:");
        console.log(data);

        $.post("AJAX/signup.php", data, result => {
            console.log("result:");
            console.log(result);

            result = JSON.parse(result);

            if (result.success) {
                $('#signup_submit').append('<div>'+result.message+'</div>');
            } else {
                if (result.errors.firstname) $('.firstname-error').html(result.errors.firstname).show();
                if (result.errors.surname) $('.surname-error').html(result.errors.surname).show();
                if (result.errors.email) $('.email-error').html(result.errors.email).show();
                if (result.errors.password) $('.password-error').html(result.errors.password).show();
                if (result.errors.confirm) $('.confirm-error').html(result.errors.confirm).show();
            }
        });
    });
});