向 PHP 表单添加字段

Add a field to PHP form

我是 PHP 的新手;将此表单 http://myprogrammingblog.com/2013/08/27/how-to-make-a-contact-form-with-bootstrap-3-jqueryphphtml5jqbootstrapvalidation/ 整合到我的 Bootstrap 页面中。效果很好,但我想弄清楚如何向表单添加一个名为 "Organization" 的字段(显然是 PHP 一侧;我了解如何将输入添加到表单)。谁能帮我吗?

编辑:我从教程的评论中了解到我需要执行以下操作: 1. 给表单本身添加一个输入 2.将新的var添加到JS验证中 3. 在 PHP 中捕获客户端输入并添加将客户端输入保存到邮件函数中的变量

我尝试这样做,但表单现在不发送信息。

<form class="well" id="contactForm" name="sentMessage" novalidate="">Contact me
       <!-- Full Name -->
<div class="control-group">
<div class="controls">
        <input class="form-control" id="name" type="text" placeholder="Full Name" required="" data-validation-required-message="Please enter your name" />

</div>
</div>
        <!-- Email -->
<div class="control-group">
<div class="controls">
        <input class="form-control" id="email" type="email" placeholder="Email" required="" data-validation-required-message="Please enter your email" /></div>
</div>
        <!--Message -->
<div class="control-group">
<div class="controls"></div>
</div>
<div id="success"></div>
 <!-- For success/fail messages -->
 <button class="btn btn-primary pull-right" type="submit">Send</button>

</form>

/*
  Jquery Validation using jqBootstrapValidation
   example is taken from jqBootstrapValidation docs
  */
$(function() {

 $("input,textarea").jqBootstrapValidation(
    {
     preventSubmit: true,
     submitError: function($form, event, errors) {
      // something to have when submit produces an error ?
      // Not decided if I need it yet
     },
     submitSuccess: function($form, event) {
      event.preventDefault(); // prevent default submit haviour
       // get values from FORM
       var name = $("input#name").val();
       var email = $("input#email").val();
       var message = $("textarea#message").val();
        var firstName = name; // For Success/Failure Message
           // Check for white space in name for Success/Fail message
        if (firstName.indexOf(' ') >= 0) {
       firstName = name.split(' ').slice(0, -1).join(' ');
         }
     $.ajax({
                url: "./bin/contact_me.php",
                type: "POST",
                data: {name: name, email: email, message: message},
                cache: false,
                success: function() {
                // Success message
                   $('#success').html("</pre>
<div class="alert alert-success">");
 $('#success > .alert-success').html("<button class="close" type="button" data-dismiss="alert">×")
 .append( "</button>");
 $('#success > .alert-success')
 .append("<strong>Your message has been sent. </strong>");
 $('#success > .alert-success')
 .append('</div>
<pre>
');

          //clear all fields
          $('#contactForm').trigger("reset");
          },
       error: function() {
        // Fail message
         $('#success').html("</pre>
<div class="alert alert-danger">");
 $('#success > .alert-danger').html("<button class="close" type="button" data-dismiss="alert">×")
 .append( "</button>");
 $('#success > .alert-danger').append("<strong>Sorry "+firstName+" it seems that my mail server is not responding...</strong> Could you please email me directly to <a href="'mailto:me@example.com?Subject=Message_Me">me@example.com</a> ? Sorry for the inconvenience!");
 $('#success > .alert-danger').append('</div>
<pre>
');
        //clear all fields
        $('#contactForm').trigger("reset");
        },
           })
         },
         filter: function() {
                   return $(this).is(":visible");
         },
       });

      $("a[data-toggle=\"tab\"]").click(function(e) {
                    e.preventDefault();
                    $(this).tab("show");
        });
  });

/*When clicking on Full hide fail/success boxes */
$('#name').focus(function() {
     $('#success').html('');
  });

<?php 
// check if fields passed are empty 

 if(empty($_POST['name'])   ||    
    empty($_POST['email'])  ||
    empty($_POST['message'])||   
    !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))    
  {     
       echo "No arguments Provided!";   return false;    
  } 

  $name = $_POST['name']; 
  $email_address = $_POST['email']; 
  $message = $_POST['message'];      

 // create email body and send it    
 $to = 'me@myprogrammingblog.com'; 
 // put your email 
 $email_subject = "Contact form submitted by:  $name"; $email_body = "You have received a new message. \n\n".                 
                   " Here are the details:\n \nName: $name \n ".                  
                   "Email: $email_address\n Message \n $message"; 
 $headers = "From: contacts@myprogrammingblog.com\n"; 
 $headers .= "Reply-To: $email_address";     

 mail($to,$email_subject,$email_body,$headers); return true;             
?>

您需要在 ajax 调用和 php 代码中修改几行代码。 我相信您会将变量添加到电子邮件主题。

HTML

<div class="controls">
    <input class="form-control" id="organization" type="text" placeholder="Organization" required="" data-validation-required-message="Please enter your organization" /></div>
</div>

将此添加到您的 ajax 通话中

 var organization = $("input#organization").val();

将数据行改为:

data: {name: name, email: email, organization : organization, message: message},

用这个 if 子句替换 php 脚本中的 if 子句:

if(empty($_POST['name'])   ||    
   empty($_POST['email'])  ||
   empty($_POST['message'])||
   empty($_POST['organization'])||   
   !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))    
{     
     echo "No arguments Provided!";   return false; 
} 

并添加这一行:

$organization = $_POST['organization']; 

解释:

创建的控件由验证器评估。当一切正常时,调用 ajax 函数。在这个函数中,id 为 organization 的元素 input 的值被检索并存储到一个变量中。此变量被添加到 ajax 调用的数据字符串中。这实际上是一个对象转换为 post 变量。所以 post 变量 organization 现在被添加到请求中。 PHP 现在可以使用 $_POST['organization'].

检索新的 post 变量