2017-02-16 16 views
0

Это мой первый пост. Я начинаю пытаться разработать инструмент, который отправляет SMS с помощью Twilio API.Передача значений взад и вперед от HTML до PHP-файла

У меня есть следующий:

  1. index.html, содержащая форму, чтобы захватить номер телефона и сообщение с кнопкой отправки для отправки сообщений в файл PHP.
  2. send-sms.php, который обрабатывает и отправляет sms, прежде чем выводить сообщение об успешном завершении на отдельной странице конечному пользователю.

Я хочу использовать AJAX для работы между HTML-файлом и PHP, чтобы поддерживать пользователя на этой HTML-странице.

Любые советы для достижения этой цели?

Мой HTML является основным:

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="style.css"> 
</head> 

<div class="container"> 
<form id="contact" action="sendsms.php" method="post"> 
<h3>Send SMS Tester</h3> 
<h4>by <a href="mailto:[email protected]">Uncle Dan</a></h4> 
    <fieldset> 
     <input placeholder="To Phone Number (format: +1555123456)" name="phone" type="tel" tabindex="3" required> 
    </fieldset> 

    <fieldset> 
     <textarea placeholder="Message Body (max 160 chars)" name="body" tabindex="5" required></textarea> 
    </fieldset> 

    <fieldset> 
     <input name="submit" type="submit" id="contact-submit" value="Send message" data-submit="...Sending"> 
    </fieldset> 

    <!--<input type="submit" value="Send message" />--> 
</form> 
</div> 
</html> 

Как использовать AJAX в приведенном выше HTML для общения с PHP и вернуть сообщение об успешном назад?

Вот некоторый код из моего PHP файла:

require __DIR__ . '/twilio-php-master/Twilio/autoload.php'; 

// Use the REST API Client to make requests to the Twilio REST API 
use Twilio\Rest\Client; 

// Credentials to connect to Twilio 
$accountSid = 'AC'; 
$authToken = 'xxx'; 

// Create a connection to Twilio's API with credentials 
$client = new Client($accountSid, $authToken); 

// Actually send the number. This is where the magic happens! *** This needs rework! Use the bookmarked Twilio article to change. 

//$client = new Services_Twilio($account_sid, $auth_token); 
$message = $client->messages->create(
//'to' => $_POST['phone'], 
$_POST['phone'], 
    array(
    'from' => '+1555123456', 
    'body' => $_POST['body'])); 

if($message->sid): 
// This content will appear conditionally when the form is submitted 
?> 

<p>Up, up and awaaaay! Your SMS has been sent :)</p> 

<?php endif; ?> 
+0

Если вы хотите использовать Ajax, читать учебник о это (есть буквально тысячи из них, если вы просто рекламируете его) и попробуйте. Когда вы застряли, вернитесь, покажите нам, что вы пробовали, и мы можем вам помочь. SO не является ни учебным сайтом, ни бесплатным сервисом кодирования. –

ответ

0

Для использования Ajax, есть небольшие изменения в обоих файлах.

Сначала я предлагаю вам использовать jQuery Ajax из index.html и поддерживать форму отправки запроса Ajax в сообщении о событии отправки. И из файла, ответ от эха, и я предлагаю вам использовать ответ json_encode.

+0

Спасибо @ Álvaro-touzón - Я сделаю это! –

0

Проверьте этот образец кода. Может быть, это будет вести Вас, чтобы создать более подходящую версию для вашего одного ...

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 

    <script type="text/javascript"> 
     $(document).ready(function() { 

      $("#contact").submit(function(event) { 
       var phoneNumber = $('#phone').val(); 
       var body = $('#body').val(); 

       console.log('phoneNumber',phoneNumber); 
       console.log('body',body); 

       // Jquery code for making AJAX call to server side script 
       $.ajax({ 
        method: "POST", 
        url: "server.php", // use your server side PHP script file name at here 
        data: { phoneNumber: phoneNumber, body: body } 
       }) 
       .done(function(response) { 
        alert("Response Message from server: " + response); 
       }); 

       return false; 
      }); 

     }); 
    </script> 
</head> 
<body> 
    <form id="contact" action="sendsms.php" method="post"> 
     <h3>Send SMS Tester</h3> 
     <h4>by <a href="mailto:[email protected]">Uncle Dan</a></h4> 

     <fieldset> 
      <input placeholder="To Phone Number (format: +1555123456)" id="phone" name="phone" type="tel" tabindex="3" required> 
     </fieldset> 

     <fieldset> 
      <textarea placeholder="Message Body (max 160 chars)" id="body" name="body" tabindex="5" required></textarea> 
     </fieldset> 

     <fieldset> 
      <input name="submit" type="submit" id="contact-submit" value="Send message" data-submit="...Sending"> 
     </fieldset> 
    </form> 
</body> 
</html> 

Код для server.php файла

// Access POST data 
$phoneNumber = $_POST['phoneNumber']; 
$body = $_POST['body']; 
+0

спасибо, что дал мне отправную точку. Я очень ценю это! –

+0

Привет, Дэн, Если вы чувствуете, что мой ответ решил вашу проблему, вы можете принять это как ответ. – mi6crazyheart