2017-02-14 27 views
0

私のウェブサイトには以下の連絡フォームがあります。しかし、フォームデータがURLに追加され、jsonがPHPメールハンドラに送信されていません。以下はフォームの私のコードです。PHPが私のウェブサイトから電子メールを送信しない

HTML

<form novalidate="novalidate" style="width:60%;margin-left:auto;margin-right:auto;" onsubmit="sendMailNew()"> 
<div class="col-md-12"> 
    <div class="col-md-6" style="padding-right: 5px"> 
         <input type="text" class="form-control" name="contact_uname" id="contact_uname" placeholder="NAME" style="width:100%"> 
        </div> 
        <div class="col-md-6"> 
         <input type="text" class="form-control" name="contact_no" id="contact_no" placeholder="PHONE NUMBER" style="width:100%"> 
        </div> 

     <div class="col-md-12" style="margin-top: 3%"> 
      <input class="form-control" type="email" name="contact_email" id="contact_email" placeholder="E-MAIL ADDRESS" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_company" id="contact_company" placeholder="COMPANY" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_website" id="contact_website" placeholder="EXISTING WEBSITE(if any)" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_social" id="contact_social" placeholder="WHAT WOULD YOU LIKE(website, social media etc)" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_budget" id="contact_budget" placeholder="BUDGET(if we know approximately how much you're hoping to spend. we can (hopefully) come up with a strategy that fits your budget.)" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_section" id="contact_section" placeholder="WHAT SECTION WOULD YOU LIKE ON THE SITE" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_update" id="contact_update" placeholder="WHICH OF THOSE SECTIONS WILL YOU WANT TO BE ABLE TO UPDATE YOURSELF?" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_design" id="contact_design" placeholder="ANY IDEA ON THE STYLE OT DESIGN? DO YOU HAVE REFERENCES?" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_timeline" id="contact_timeline" placeholder="TIMELINE(when do you want to launch?)" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_hear" id="contact_hear" placeholder="HOW DID YOU HEAR ABOUT US?" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top: 3%"> 
      <input type="text" class="form-control" name="contact_comment" id="contact_comment" placeholder="ANY OTHER COMMENTS?" style="width:100%"> 
     </div> 
     <div class="col-md-12" style="margin-top:3%"> 
         <button type="submit" name="submit" value="submit" style="position:relative;left:45%;color:#22252c !important;background-color:white !important" class="btn btn-default">SUBMIT NOW</button> 
        </div> 
    </div> 
    </form> 

AJAXスクリプト

<script type="text/javascript"> 
       function sendMailNew() 
       { 
        $.ajax({ 
        type: 'POST', 
        url: 'contactmail.php', 
        data: { cname: $("#contact_uname").val(), cno: $().val("#contact_no"), cemail: $("#contact_email").val(), ccompany: $("#contact_company").val(), cwebsite: $("#contact_website").val(), csocial: $("#contact_social").val(), cbudget: $("#contact_budget").val(), csection: $("#contact_section").val(), cupdate: $("#contact_update").val(), cdesign: $("#contact_design").val(), ctimeline: $("#contact_timeline").val(), chear: $("#contact_hear").val(), ccomment: $("#contact_comment").val() }, 
        async: false, 
        success: function (data) { 
        $("#contact_uname").val()=data; 
        $("#contact_no").val()=""; 
        $("#contact_email").val()=""; 
        $("#contact_company").val()=""; 
        $("#contact_website").val()=""; 
        $("#contact_social").val()=""; 
        $("#contact_budget").val()=""; 
        $("#contact_section").val()=""; 
        $("#contact_update").val()=""; 
        $("#contact_design").val()=""; 
        $("#contact_timeline").val()=""; 
        $("#contact_hear").val()=""; 
        $("#contact_comment").val()=""; 
        },      
        dataType: 'json', 
        error: function (e, g, y) { 
        var msg = e; 
        } 
        }); 
        alert('Thanks for submitting the form, we will get back to you soon!'); 
       }   
      </script> 

PHPのメールハンドラ

<?php 
    if(isset($_POST['submit'])){ 
    $to = "[email protected]"; 
    $from = $_POST['contact_email']; // this is the sender's Email address 
    $name = $_POST['contact_uname']; 
    $number = $_POST['contact_no']; 
    $company = $_POST['contact_company']; 
    $website = $_POST['contact_website']; 
    $social = $_POST['contact_social']; 
    $budget = $_POST['contact_budget']; 
    $section = $_POST['contact_section']; 
    $update = $_POST['contact_update']; 
    $design = $_POST['contact_design']; 
    $timeline = $_POST['contact_timeline']; 
    $hear = $_POST['contact_hear']; 
    $comment = $_POST['contact_comment']; 
    $subject = "Form submission"; 
    $subject2 = "Copy of your form submission"; 
    $message = "Name:" . $name . "\n Email: " . $from . "\n Number:" . $number . "\n Company:" . $company . "\n Website:" . $website . "\n Social:" . $social . "\n Budget:" . $budget . "\n Section:" . $section . "\n Update:" . $update . "\n Design:" . $design . "\n Timeline:" . $timeline . "\n Hear:" . $hear . "\n Comment:" . $comment; 
    $headers = "From:" . $from; 
    mail($to,$subject,$message,$headers); 
    } 
?> 

この問題を解決するためにどのように任意のアイデア?

ありがとうございます!

+0

、HTMLのみとJSのショーコードを。より具体的な質問をする。 –

+0

ボタンにonclick属性を追加します。ボタンから型送信を削除します。これを行う:sendMailNew(イベント)。あなたの関数でこれを行う、event.preventDefault();実際に何かを解析していることを確認するために、ajax呼び出しでデータ変数のconsole.logを試してみてください。 – Akintunde007

答えて

0

最初にjavascriptでデフォルトのアクションを停止します。

<script type="text/javascript"> 
function sendMailNew() 
    { 
    event.preventDefault(); 
    //Your rest of JS here 
    } 
</script> 

私はよく分からないが、あなたは、フォームにaction=""を追加する必要があります。解決したら教えてください。

0

オプションはタイプではありません: 'POST'、 これは方法: 'POST'です。だから、デフォルトではGETリクエストでなければなりません。

PHPスクリプトでは、 "$ _POST"の値を取得するため、パラメータが見つかりません。この方法で試してみてください。私はポストリクエストに$ .ajaxではなく$ .postを使用することを好みます。スクリプトをより良くするには、デフォルトのイベントを防ぐべきであり、urlを使ってデータを属性アクションとして送信し、$( 'form')。attr( 'action')でリクエストすることができます。私はこの方法を好む

$.ajax({ 
    method: "POST", 
    url: "some.php", 
    data: { name: "John", location: "Boston" } 
}) 

は、それだけできれいに見える、あなたが提出する方法とmisstakeことはできません:ページがリロードされている場合は

function sendMailNew(e) 
    { 
     e.preventDefault(); 
     var $form = $('form'); 
     var url = $form.attr('action') || 'contactmail.php'; 

     var params = { 
      cname: $("#contact_uname").val(), 
      cno: $().val("#contact_no"), 
      cemail: $("#contact_email").val(), 
      ccompany: $("#contact_company").val(), 
      cwebsite: $("#contact_website").val(), 
      csocial: $("#contact_social").val(), 
      cbudget: $("#contact_budget").val(), 
      csection: $("#contact_section").val(), 
      cupdate: $("#contact_update").val(), 
      cdesign: $("#contact_design").val(), 
      ctimeline: $("#contact_timeline").val(), 
      chear: $("#contact_hear").val(), 
      ccomment: $("#contact_comment").val() 
     }; 

     $.post(url, params, function(data, status) { 

      $("#contact_uname").val()=data; 
      $("#contact_no").val()=""; 
      $("#contact_email").val()=""; 
      $("#contact_company").val()=""; 
      $("#contact_website").val()=""; 
      $("#contact_social").val()=""; 
      $("#contact_budget").val()=""; 
      $("#contact_section").val()=""; 
      $("#contact_update").val()=""; 
      $("#contact_design").val()=""; 
      $("#contact_timeline").val()=""; 
      $("#contact_hear").val()=""; 
      $("#contact_comment").val()=""; 

     }, 'json').fail(function() { 
      alert("error"); 
     }); 
    } 
+0

これは間違っています。それはタイプポストであり、メソッドポストではなく、ajaxコールをするときです。これを修正するには、デフォルトのアクションを防止します。 event.preventDefault(); – Akintunde007

+0

なぜですか?型はメソッドの単なるエイリアスです!私たちはjQueryのバージョンを知っていません。おそらく、彼は彼のデバッグツールでネットワークリクエストのいくつかのスナップを表示することができます。 http://api.jquery.com/jquery.ajax/ >>>> type(デフォルト: 'GET') タイプ:文字列 メソッドのエイリアス。 1.9.0より前のバージョンのjQueryを使用している場合は、typeを使用してください。 <<<< >>>方法(デフォルト: 'GET'):( "PUT"、 "GET"、例えば "POST")要求に使用するストリング HTTPメソッド タイプ。 (バージョンが追加されました:1.9.0)<<< – fGeyer

+0

私はjquery 3.1.1を使用しています。現在 –

関連する問題