Разбор JSON данных с JS поступают от PHP

Question

Моя форма:

  <form class="form-inline signup" action="php/signupForm.php" role="form" id="signupForm"> 
     <div class="form-group"> 
      <input type="email" name="email" class="form-control" placeholder="Email address"> 
     </div> 
     <div class="form-group"> 
      <button type="submit" class="btn btn-theme ladda-button" data-style="expand-left"> 
<span class="ladda-label" id="notice">Get notified!</span> 
</button> 
     </div> 
     </form> 

конец моего PHP скрипт

$response = array(
    "status" => $status, 
    "message" => $message 
); 

echo json_encode($response); 

Моя страница получает данные, как:

{"status":0,"message":"This email is already on list!"} 

с использованием JS Мне нужно проанализировать эти данные и затем обновить текст внутри элемента.

<span id="notice">Get notified!</span> 

вот мой сценарий, который не работает, после того, как senging данные формы на мой PHP скрипт я получаю белый экран, который показывает JSON сильный

$(document).ready(function() { 
     $.ajax({ 
     dataType: 'json', 
     $('#notice').text(data.message); 
     }); 
    }); 

Answer 1

Вы должны обработать ответ на обратный вызов ,

$(document).ready(function() { 
    $('form').on('submit', function(e) { 
     e.preventDefault(); 
     $.ajax({ 
      data: $(this).serialize(), 
      url: $(this).attr('action'), // Or the path of the PHP file 
      dataType: 'json', 
     }).done(function(response) { 
      $('#notice').text(response.message); 
     }); 
    }); 
}); 

Смотрите соответствующие документы here

Answer 2

Это Аякса вызов не хорошо сформированные, отсутствие успеха обратного вызова и URL-адрес, например:

$(document).ready(function() { 
    $.ajax({ 
     url: '/the/url/where/your/data/comes/from/', 
     dataType: 'json', 
     success: function (data) { 
      $('#notice').text(data.message); 
     } 
    }); 
}); 

Answer 3

Ваш код, как есть, только выполняющийся на странице загрузки и а не при подаче формы. Вам необходимо прикрепить событие onsubmit, предотвратить действие по умолчанию для отправки формы и выполнить свой вызов ajax. Кроме того, ваши Аякса называют сам был уродливы

$("#yourFormID").submit(function(e){ 
    e.preventDefault(); 
    $.ajax({ 
     url:"/urlToServerScript", 
     data:{} //any form data the script needs you should be put here, 
     dataType:"json" //type of response the server will output 
    }).then(function(data){ 
     $('#notice').text(data.message); 
    }); 
});