DropDown选择未提交给表单

时间:2017-07-21 11:56:24

标签: php html forms

我的表单提交电子邮件,但下拉选择区域为空白。我完全收到姓名,电子邮件和电话号码,但收入只是“收入:”。无法找到解决方案。

HTML:

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Azaadville Contact Form</title>
  <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>


  
  <link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css'>
<link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css'>
<link rel='stylesheet prefetch' href='http://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css'>

      <link rel="stylesheet" href="css/style.css">

  
</head>

<body style="background-color: #bcd43e;">
  <div class="container">
<br/><br/><br/><br/><br/><br/>
    <form class="well form-horizontal" action="form-to-email.php" method="POST"  id="contact_form" >
<fieldset>

<!-- Form Name -->
<legend style="font-size:30px; text-align:center;">Leave your details and a Property Specialist will contact you with more information.</legend>

<img class="img-responsive center-block" src="images/logo.png" alt="Azaadville Gardens" width= "60%;"><br/>

<!-- Text input-->
<br/><br/>
<div class="form-group">
  <label class="col-md-4 control-label" style="font-size:30px;">First Name</label>  
  <div style="font-size:30px;" class="col-md-4 inputGroupContainer">
  <div class="input-group">
  <span class="input-group-addon" style="font-size:40px;"><i class="glyphicon glyphicon-user"></i></span>
  <input  style="font-size:25px; height: 70px;" name="first_name" placeholder="First Name" class="form-control"  type="text">
    </div>
  </div>
</div>

<!-- Text input-->
<br/><br/>
<div class="form-group">
  <label class="col-md-4 control-label" style="font-size:30px;">Last Name</label> 
    <div class="col-md-4 inputGroupContainer">
    <div class="input-group">
  <span class="input-group-addon" style="font-size:40px;"><i class="glyphicon glyphicon-user"></i></span>
  <input style="font-size:25px; height: 70px;" name="last_name" placeholder="Last Name" class="form-control"  type="text">
    </div>
  </div>
</div>

<!-- Text input-->
<br/><br/>
       <div class="form-group">
  <label class="col-md-4 control-label" style="font-size:30px;">E-Mail</label>  
    <div class="col-md-4 inputGroupContainer" >
    <div class="input-group">
        <span class="input-group-addon" style="font-size:40px;"><i class="glyphicon glyphicon-envelope"></i></span>
  <input style="font-size:25px; height: 70px;" name="email" placeholder="E-Mail Address" class="form-control"  type="text">
    </div>
  </div>
</div>

<!-- Select Basic -->
<br/><br/> 
<div class="form-group"> 
  <label class="col-md-4 control-label" style="font-size:30px;">Combined Monthly Income</label>
    <div class="col-md-4 selectContainer">
    <div class="input-group">
        <span class="input-group-addon" style="font-size:40px;"><i class="glyphicon glyphicon-list"></i></span>
    <select style="font-size:25px; height: 70px;" name="income">
      <option value=" " >Please select combined monthly income range</option>
      <option>Below R14 999</option>
      <option>Between R15 000 and R19 999</option>
      <option >Between R20 000 and R24 999</option>
      <option >Between R25 000 and R29 999</option>
      <option >Over R30 000</option>
    </select>
  </div>
</div>
</div>

<!-- Success message -->
<div class="alert alert-success" role="alert" id="success_message">Success <i class="glyphicon glyphicon-thumbs-up"></i> Thanks for contacting us, we will get back to you shortly.</div>
<br/><br/>
<!-- Button -->
<div class="form-group">
  <label class="col-md-4 control-label"></label>
  <div class="col-md-4">
    <button style="font-size:30px; background: #13954b;" type="submit" class="btn btn-warning" >Get More Information <span class="glyphicon glyphicon-send"></span></button>
  </div>
</div>

</fieldset>
</form>
</div>
    </div><!-- /.container -->
  <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/bootstrap-validator/0.4.5/js/bootstrapvalidator.min.js'></script>

    <script src="js/index.js"></script>

</body>
</html>

PHP:

<?php
if(isset($_POST['email'])) {
 
    // EDIT THE 2 LINES BELOW AS REQUIRED
    $email_to = "marcelles@msp.property";
    $email_subject = "New SMS form submission";
 
    function died($error) {
        // your error code can go here
        echo "We are very sorry, but there were error(s) found with the form you submitted. ";
        echo "These errors appear below.<br /><br />";
        echo $error."<br /><br />";
        echo "Please go back and fix these errors.<br /><br />";
        die();
    }
 
 
    // validation expected data exists
    if(!isset($_POST['first_name']) ||
        !isset($_POST['last_name']) ||
        !isset($_POST['email']) ||
        !isset($_POST['income'])) {
        died('We are sorry, but there appears to be a problem with the form you submitted.');       
    }
 
     
 
    $first_name = $_POST['first_name']; // required
    $last_name = $_POST['last_name']; // required
    $email_from = $_POST['email']; // required
    $comments = $_POST['income']; // required
 
    $error_message = "";
    $email_exp = '/^[A-Za-z0-9._%-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,8}$/';
 
  if(!preg_match($email_exp,$email_from)) {
    $error_message .= 'The Email Address you entered does not appear to be valid.<br />';
  }
 
    $string_exp = "/^[A-Za-z .'-]+$/";
 
  if(!preg_match($string_exp,$first_name)) {
    $error_message .= 'The First Name you entered does not appear to be valid.<br />';
  }
 
  if(!preg_match($string_exp,$last_name)) {
    $error_message .= 'The Last Name you entered does not appear to be valid.<br />';
  }
 
  if(strlen($comments) < 2) {
    $error_message .= 'The Income you entered does not appear to be valid.<br />';
  }
 
  if(strlen($error_message) > 0) {
    died($error_message);
  }
 
    $email_message = "Form details below.\n\n";
 
     
    function clean_string($string) {
      $bad = array("content-type","bcc:","to:","cc:","href");
      return str_replace($bad,"",$string);
    }
 
     
 
    $email_message .= "First Name: ".clean_string($first_name)."\n";
    $email_message .= "Last Name: ".clean_string($last_name)."\n";
    $email_message .= "Email: ".clean_string($email_from)."\n";
    $email_message .= "Monthly Household Income Range: ".clean_string($comments)."\n";
 
// create email headers
$headers = 'From: '.$email_from."\r\n".
'Reply-To: '.$email_from."\r\n" .
'X-Mailer: PHP/' . phpversion();
@mail($email_to, $email_subject, $email_message, $headers);  
?>
 
<!-- include your own success html here -->
 
Thank you for contacting us. A Property Specialist will be in touch with you very soon.
 
<?php
 
}
?>

我错过了什么。我很确定这是愚蠢的事。

1 个答案:

答案 0 :(得分:0)

为您的选择框选项添加值属性,因为选择框获取并提交所选的选项值而不是内部HTML。您可以在此处了解详情 - https://www.w3schools.com/tags/att_option_value.asp并更改您的选择框选项:

<select style="font-size:25px; height: 70px;" name="income">
      <option value="" disabled selected>Please select combined monthly income range</option>
      <option value="Below R14 999">Below R14 999</option>
      <option value="Between R15 000 and R19 999">Between R15 000 and R19 999</option>
      <option value="Between R20 000 and R24 999">Between R20 000 and R24 999</option>
      <option value="Between R25 000 and R29 999">Between R25 000 and R29 999</option>
      <option value="Over R30 000">Over R30 000</option>
</select>