Javascript 看一看,让我知道它是否适合你。我修改了代码,以更新到最新的引导,作为控制组和控制被折旧。非常感谢,我将对此进行深入研究。由于某些原因,表单未正确验证选择框 /* Jquery Validation using jqBootstrapValidat

Javascript 看一看,让我知道它是否适合你。我修改了代码,以更新到最新的引导,作为控制组和控制被折旧。非常感谢,我将对此进行深入研究。由于某些原因,表单未正确验证选择框 /* Jquery Validation using jqBootstrapValidat,javascript,php,jquery,Javascript,Php,Jquery,看一看,让我知道它是否适合你。我修改了代码,以更新到最新的引导,作为控制组和控制被折旧。非常感谢,我将对此进行深入研究。由于某些原因,表单未正确验证选择框 /* Jquery Validation using jqBootstrapValidation example is taken from jqBootstrapValidation docs */ $(function() { $("input,textarea").jqBootstrapValidation( { pr


看一看,让我知道它是否适合你。我修改了代码,以更新到最新的引导,作为控制组和控制被折旧。非常感谢,我将对此进行深入研究。由于某些原因,表单未正确验证选择框
    /*
 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@examplemail.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@examplemail\n"; 
 $headers .= "Reply-To: $email_address";     

 mail($to,$email_subject,$email_body,$headers); return true;             
?>
<!DOCTYPE html>
<html lang="eng">
<head> 
<title>Contact form for your site by Anatoly Spektor</title>
<!-- Bootstrap CSS -->
<link href="./css/bootstrap.min.css" rel="stylesheet" media="screen">
</head>
<body>
<br />
<!-- a row has to be in a container -->
<div class="container"> 
<!-- Contacts -->
<div id="contacts">
<div class="row">   
 <!-- Alignment -->
<div class="col-sm-offset-3 col-sm-6">
   <!-- Form itself -->
      <form name="sentMessage" class="well" id="contactForm"  novalidate>
       <legend>Contact me</legend>
     <div class="control-group">
                <div class="controls">
        <input type="text" class="form-control" 
               placeholder="Full Name" id="name" required
                   data-validation-required-message="Please enter your name" />
          <p class="help-block"></p>
       </div>
         </div>     
            <div class="control-group">
              <div class="controls">
        <input type="email" class="form-control" placeholder="Email" 
                        id="email" required
                   data-validation-required-message="Please enter your email" />
    </div>
    </div>  
    <div class="control-group">
              <div class="controls">
        <select name="subject" class="form-control" 
                        id="subject" required
                   data-validation-required-message="Please select sublect">
                   <option value "">Choose subject</option>
         <option>sales</option>    
         <option>Comment</option>    
                </select>
    </div>
    </div>  

           <div class="control-group">
             <div class="controls">
             <textarea rows="10" cols="100" class="form-control" 
                   placeholder="Message" id="message" required
           data-validation-required-message="Please enter your message" minlength="5" 
                   data-validation-minlength-message="Min 5 characters" 
                    maxlength="999" style="resize:none"></textarea>
    </div>
           </div>        
     <div id="success"> </div> <!-- For success/fail messages -->
    <button type="submit" class="btn btn-primary pull-right">Send</button><br />
      </form>
  </div>
 </div>
</div>
</div>


<!-- JS FILES -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">  
</script> 
<script src="./js/bootstrap.min.js"></script>
<script src="./js/jqBootstrapValidation.js"></script>
<script src="./js/contact_me.js"></script>

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

$("input,select,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 behaviour
   // get values from FORM
   var name = $("input#name").val();  
   var email = $("input#email").val(); 
   var message = $("textarea#message").val();
   var subject = $("select#subject").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, subject: subject},
            cache: false,
            success: function() {  
            // Success message
               $('#success').html("<div class='alert alert-success'>");
               $('#success > .alert-success').html("<button type='button' class='close' 
    data-dismiss='alert' aria-hidden='true'>&times;")
                .append( "</button>");
              $('#success > .alert-success')
                .append("<strong>Your message has been sent. </strong>");
      $('#success > .alert-success')
        .append('</div>');

      //clear all fields
      $('#contactForm').trigger("reset");
      },
   error: function() {      
    // Fail message
     $('#success').html("<div class='alert alert-danger'>");
            $('#success > .alert-danger').html("<button type='button' class='close' 
    data-dismiss='alert' aria-hidden='true'>&times;")
             .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 from 
    myprogrammingblog.com'>me@example.com</a> ? Sorry for the inconvenience!");
        $('#success > .alert-danger').append('</div>');
    //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'])    || 
empty($_POST['subject']) ||
!filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
{
  echo "No arguments Provided!";
  return false;
}

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

// create email body and send it    
$to = 'youremail@gmail.com'; // put your email
$email_subject = "$subject";
$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: youremail@yahoo.com\n";
$headers .= "Reply-To: $email_address"; 
mail($to,$email_subject,$email_body,$headers);
return true;            
?>