Question

我创建了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框架。非常感谢您的协助。

PHP和AJAX代码的源3 PHP,AJAX, HTML5 contact form

Answer 1

您可以将名称指定为数组，然后在请求中将其作为$_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）

Answer 2

根据您的要求，有更简单的方法来实现这一目标。如果你想用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

使用PHP，HTML5和AJAX从联系表单中检索复选框值

2 个答案: