Как мне показать мой php-ответ на моей странице без обновления с помощью ajax?

#javascript #php #jquery #ajax

Вопрос:

У меня есть эта форма

     <form action="send.php" method="post">
          <div class="col-md-12">
            <div class="input-group input-group-lg">
              <span class="input-group-addon" id="sizing-addon1"><i class="fa fa-credit-card"></i></span>

             <input id="nfc" name="nfc" type="text" required class="form-control" placeholder="Wristband UID will appear here...." aria-describedby="sizing-addon1">
             </div>

<br>
              <div class="input-group input-group-lg">
                  <span class="input-group-addon" id="sizing-addon1"><i class="fa fa-phone"></i></span>
                   <input id="phone" name="phone" type="text" value="254" required class="form-control" placeholder="Registered Phone Number" aria-describedby="sizing-addon1">
             </div>  

<br>
          <button type="submit" class="btn btn-color btn-lg">OK, Im Done</button>
</div>
            <div id="alert"></div>
</form>

Я хотел бы обработать ввод с помощью этого php-скрипта:

 <?php 
$nfc = $_POST["nfc"];
$phone = $_POST["phone"];


$post = [
'nfc' => $nfc,
//'password' => '9907',
'phone' => $phone,

];

header( "Content-Type: application/json" );

$ch = curl_init('myAPIUrl');//posts input to my api and i get a response

curl_setopt($ch, CURLOPT_POSTFIELDS, $post);


curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

$server_output = curl_exec ($ch);

curl_close ($ch);

header( "refresh:1400;url=http://www.swype.co.ke/counter/index.html" );

var_dump($server_output);
?>

и покажите ответ формы в div id «ALERT» на той же странице. Мой URL-адрес API — это api, параметрами которого являются поля ввода. Я получаю ответ api, как показано ниже.

 string(121) "{"idUser":42,"rfid":"4534543","username":"","transactionStatus":"NFC tag has been updated successfully","statusCode":200}"

1. Вы не можете без ajax .. или без обновления страницы..

2. Если вы используете php only, страница должна быть каким-то образом обновлена, чтобы отразить результаты.

3. @scaisEdge ajax — не единственный способ… только самый распространенный. Несколько других способов сделать это также

4. @charlietfl правильно.. но что-то должно быть сделано .. ajax .. submit ..

5. @charlietfl Как мне сделать это с помощью ajax?

Ответ №1:

Чтобы обработать ввод с помощью PHP, вам необходимо отправить данные формы на сервер. Чтобы отобразить оповещение с ответом от сервера, вам нужно либо отправить форму (тем самым обновив страницу), либо использовать AJAX для отправки данных формы и ожидания ответа.

Прямо сейчас вы используете PHP для выполнения чего-то, что вы потенциально могли бы сделать с AJAX. Попробуйте что-то вроде этого:

 $( "form" ).submit(function( event ) {
  // request json with 
  $.getJSON( "http://www.swype.co.ke/counter/index.html", 
    // whatever data you want to send from your form
    { name: "John", time: "2pm" },
    function( data ) {
      // show the result of processing the data
      alert(data);
    }
  );

  // prevent form from refreshing the page
  event.preventDefault();
});