2017-10-01 5 views
0

Ich hatte ein funktionierendes Kontaktformular auf einer Website, die gut lief. Keine Leistungsprobleme überhaupt.E-Mail wird nicht gesendet, wenn zusätzliche Felder hinzugefügt werden

Ich wurde gebeten, ein erforderliches Feld Telefon und Adresse hinzuzufügen, und es hat aufgehört zu senden. Ich kann keine Codierungsfehler finden, deshalb bitte ich um Hilfe. Manchmal brauchst du frische Augen, um herauszufinden, was falsch ist.

Hinweis: Die verwendete jquery-Validierungsdatei ist die Standard-Bootstrap-Version, nicht bearbeitet.

Vielen Dank im Voraus!

Die HTML:

<form name="sentMessage" id="contactForm" novalidate> 
    <div class="row"> 
    <div class="col-md-6"> 
    <div class="form-group"> 
    <input type="text" id="name" class="form-control" placeholder="Name" required="required"> 
    <p class="help-block text-danger"></p> 
    </div> 
    </div> 
    <div class="col-md-6"> 
    <div class="form-group"> 
    <input type="email" id="email" class="form-control" placeholder="Email" required="required"> 
    <p class="help-block text-danger"></p> 
    </div> 
    </div> 
    <div class="col-md-6"> 
    <div class="form-group"> 
    <input type="text" id="phone" class="form-control" placeholder="Phone" required="required"> 
    <p class="help-block text-danger"></p> 
    </div> 
    </div> 
    <div class="col-md-6"> 
    <div class="form-group"> 
    <input type="text" id="address" class="form-control" placeholder="Address" required="required"> 
    <p class="help-block text-danger"></p> 
    </div> 
    </div> 
    </div> 
    <div class="form-group"> 
    <textarea name="message" id="message" class="form-control" rows="4" placeholder="Message" required></textarea> 
    <p class="help-block text-danger"></p> 
    </div> 
    <div id="success"></div> 
    <button type="submit" class="btn btn-custom btn-lg">Send Message</button> 
    </form> 

Und die PHP dahinter:

<?php 
    // Check for empty fields 
    if(empty($_POST['name'])  || 
     empty($_POST['email'])  || 
     empty($_POST['phone'])  || 
     empty($_POST['address'])   || 
     empty($_POST['message']) || 
     !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL)) 
     { 
     echo "No arguments Provided!"; 
     return false; 
     } 

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

    // Create the email and send the message 
    $to = 'Sample for [email protected]'; // 
    $email_subject = "XXX Form: $name"; 

    $email_body = "You have received a new message from your website contact form.\n\n"."Here are the details: 
    \n\nName: $name 
    \n\nEmail: $email_address 
    \n\nPhone: $phone 
    \n\nAddress: $address 
    \n\nMessage:\n$message"; 
    $headers = "From: [email protected]\n"; // 
    $headers .= "Reply-To: $email_address"; 
    mail($to,$email_subject,$email_body,$headers); 
    return true;    
    ?> 

Und die JS:

$(function() { 

    $("input,textarea").jqBootstrapValidation({ 
    preventSubmit: true, 
    submitError: function($form, event, errors) { 
     // additional error messages or events 
    }, 
    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 phone = $("input#phone").val(); 
     var address = $("input#address").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: "././mail/contact_me.php", 
      type: "POST", 
      data: { 
       name: name, 
       email: email, 
       phone: phone, 
       address: address, 
       message: message 
      }, 
      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. Please try again later!"); 
       $('#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(''); 
    }); 
+0

Ist JavaScript überhaupt dabei? Fragen Sie einfach, weil es in Ihrem Formular-Tag keine Methode oder kein Aktionsattribut gibt. – KingRichard

+0

Der Post wurde korrigiert, um das Skript aufzunehmen. – Barbra

+0

Was passiert, wenn Sie auf die Schaltfläche klicken? – KingRichard

Antwort

1

Hier ist meine komplette Arbeitslösung.

mail.php

<?php 
$name = $_POST['name']; 
$email_address = $_POST['email']; 
$phone = $_POST['phone']; 
$address = $_POST['address']; 
$message = $_POST['message']; 

// Create the email and send the message 
$to = '[email protected]'; // 
$email_subject = "XXX Form: $name"; 

$email_body = "You have received a new message from your website contact form.\n\n"."Here are the details: 
\n\nName: $name 
\n\nEmail: $email_address 
\n\nPhone: $phone 
\n\nAddress: $address 
\n\nMessage:\n$message"; 
$headers = "From: [email protected]\n"; // 
$headers .= "Reply-To: $email_address"; 
if(mail($to,$email_subject,$email_body,$headers)) { 
    return 'true'; 
} else { 
    return 'false'; 
} 
?> 

mail.html (beinhaltet die Validierung JS)

<form name="sentMessage" id="contactForm" novalidate> 
    <div class="row"> 
     <div class="col-md-6"> 
      <div class="form-group"> 
       <input type="text" id="name" class="form-control" placeholder="Name" required="required"> 
       <p class="help-block text-danger"></p> 
      </div> 
     </div> 
     <div class="col-md-6"> 
      <div class="form-group"> 
       <input type="email" id="email" class="form-control" placeholder="Email" required="required"> 
       <p class="help-block text-danger"></p> 
      </div> 
     </div> 
     <div class="col-md-6"> 
      <div class="form-group"> 
       <input type="text" id="phone" class="form-control" placeholder="Phone" required="required"> 
       <p class="help-block text-danger"></p> 
      </div> 
     </div> 
     <div class="col-md-6"> 
      <div class="form-group"> 
       <input type="text" id="address" class="form-control" placeholder="Address" required="required"> 
       <p class="help-block text-danger"></p> 
      </div> 
     </div> 

     <div class="form-group"> 
      <textarea name="message" id="message" class="form-control" rows="4" placeholder="Message" required></textarea> 
      <p class="help-block text-danger"></p> 
     </div> 
    </div> 
    <div id="success"></div> 
    <button type="submit" class="btn btn-custom btn-lg">Send Message</button> 
</form> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <!-- or use local jquery --> 
<script src="js/jqBootstrapValidation.js"></script> 
<script> 
$(function() { 

    $("input,textarea").jqBootstrapValidation({ 
    preventSubmit: true, 
    submitError: function($form, event, errors) { 
     // additional error messages or events 
    }, 
    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 phone = $("input#phone").val(); 
     var address = $("input#address").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: "mail.php", 
      type: "POST", 
      data: { 
       name: name, 
       email: email, 
       phone: phone, 
       address: address, 
       message: message 
      }, 
      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. Please try again later!"); 
       $('#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(''); 
    }); 
</script> 

Und dann natürlich, wenn die jqBootstrapValidation.js Datei in einem Verzeichnis/js haben/

+0

Es funktioniert jetzt, sorta. Die Telefon-und Adressfelder sind nicht bevölkert obwohl. – Barbra

+0

Legen Sie das Namensattribut aller Ihrer Eingabefelder fest. – KingRichard

+0

??? Ich denke ich habe. Was vermisse ich und wo? – Barbra

Verwandte Themen