Получение значений флажков из контактной формы с использованием PHP, HTML5 и AJAX - PullRequest
0 голосов
/ 13 июня 2018

Я создал контактную форму PHP / AJAX, которая отправляет такие данные, как электронная почта, имена и текст сообщения.Пока он отправляет их на мою почту правильно.Тем не менее, я не могу заставить его отправить значения флажка ниже в обработчик формы.Ниже приведен HTML5, который я написал:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Website Contact Form</title>
<script> 
function _(id){ return document.getElementById(id); } 
function submitForm(){
   _("mybtn").disabled = true; _("status").innerHTML = 'please wait ...'; 
   var formdata = new FormData(); formdata.append( "n", _("n").value ); 
   formdata.append( "e", _("e").value ); 
   formdata.append( "m", _("m").value ); 
   var ajax = new XMLHttpRequest(); 
   ajax.open( "POST", "example_parser.php" ); 
   ajax.onreadystatechange = function() { 
       if(ajax.readyState == 4 && ajax.status == 200) { 
             if(ajax.responseText == "success"){ 
                  _("my_form").innerHTML = 'Thanks '+_("n").value+
                    ', your message has been sent.'; } 
                  else { 
                       _("status").innerHTML = ajax.responseText; 
                       _("mybtn").disabled = false; } } } ajax.send( formdata); }
</script>
</head>
<body>
<form id="my_form" onsubmit="submitForm(x); return false;">
  <p><input id="n" placeholder="Name" required></p>
  <p><input id="e" placeholder="Email Address" type="email" required></p><br/>
  <p>Please select your favorite animals below</p>
  <input type="checkbox" name="animals" value="Cats"/>Cats<br/>
  <input type="checkbox" name="animals" value="Dogs"/>Dogs<br/>
  <input type="checkbox" name="animals" value="Rabbits"/>Rabbits<br/>
  <input type="checkbox" name="animals" value="Aligators"/>Aligators<br/><br/>
  <textarea id="m" placeholder="write your message here" rows="10" required></textarea>
    <p><input id="mybtn" type="submit" value="Submit Form"> <span id="status"></span></p>
</form>
</body>
</html>

Вот обработчик формы.

<?php
    if( isset($_POST['n']) && isset($_POST['e']) && isset(&_POST['a']) && 
    isset($_POST['m']) ){
    $n = $_POST['n']; // HINT: use preg_replace() to filter the data
    $e = $_POST['e'];
    $services = $_POST['a'];
    $m = nl2br($_POST['m']);
    $to = "mydomain@gmail.com"; 
    $from = $e;
    $subject = 'Contact Form Message';
    $message = '<b>Name:</b> '.$n.' <br><b>Email:</b> '.$e.'<br/><b>Services 
            required:</b>'.$services.' <p>'.$m.'</p>';
    $headers = "From: $from\n";
    $headers .= "MIME-Version: 1.0\n";
    $headers .= "Content-type: text/html; charset=iso-8859-1\n";
    if( mail($to, $subject, $message, $headers) ){
    echo "success";
    } else {
    echo "The server failed to send the message. Please try again later.";
     }
   }
 ?>

Может ли кто-нибудь показать мне, как захватить значения флажков и переслать их наобработчик формы, использующий код AJAX, предоставленный выше.Я до сих пор незнаком с PHP и AJAX-фреймворком.Ваша помощь будет высоко оценена.

source3 из кода PHP и AJAX PHP, AJAX, HTML5 контактная форма

Ответы [ 2 ]

0 голосов
/ 13 июня 2018

Согласно вашему требованию, есть более простой способ добиться этого.Если вы хотите отправить форму с помощью ajax, вы можете использовать функцию serialize () следующим образом.Эта функция также даст вам значения флажков.Вам не нужно добавлять каждое значение элемента.Эта функция выдаст вам все значения элемента в форме.

В вашем коде JavaScript замените три строки:

var formdata = new FormData(); formdata.append( "n", _("n").value ); 
formdata.append( "e", _("e").value ); 
formdata.append( "m", _("m").value ); 

этой единственной строкой:

var formdata  = $("#my_form").serialize();

Эта функция сериализации даст вам все параметры запроса в вашем AJAX-файле.Чтобы увидеть эти параметры запроса вместе с именами параметров, вы можете просто сделать print_r ($ _ REQUEST);в вашем файле AJAX.Таким образом, вы увидите запрошенный массив параметров в консоли.После этого вы можете делать свои вещи в своем AJAX-файле по своему усмотрению.

Еще одна вещь, вы должны поставить имена ваших флажков в форме, подобной этой:

<input type="checkbox" name="animals[]" value="Cats"/>Cats<br/>
<input type="checkbox" name="animals[]" value="Dogs"/>Dogs<br/>
<input type="checkbox" name="animals[]" value="Rabbits"/>Rabbits<br/>
<input type="checkbox" name="animals[]" value="Aligators"/>Aligators
0 голосов
/ 13 июня 2018

Вы можете дать имя в виде массива, а затем обращаться к нему в запросе как $_REQUEST[variable_name]

Как:

<input type="checkbox" name="animals[]" value="Cats"/>Cats<br/>
 <input type="checkbox" name="animals[]" value="Dogs"/>Dogs<br/>
 <input type="checkbox" name="animals[]" value="Rabbits"/>Rabbits<br/>
 <input type="checkbox" name="animals[]" value="Aligators"/>Aligators<br/><br/>

Доступ к ним с помощью $_REQUEST['animals'].Я использую здесь $_REQUEST, потому что вы не упомянули метод формы (GET / POST)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...