2017-03-18 21 views
0

私のwebisteでajaxから電子メールを送信しようとしています。フォームはモーダルです(私はカスタムボックスを使用しています)。しかし、何らかの理由で私が送る値はすべてnullです。私はモーダルコンテンツでgetElementByIdを使用できますか? customboxのgitののハブへJavascript with ajax

リンク:https://github.com/dixso/custombox

function _(id) { return document.getElementById(id);} 
function submitForm() { 
    _("mybtn").disabled = true; 
    var formdata = new FormData(); 
    formdata.append("n", _("n").value); 
    formdata.append("e", _("e").value); 
    formdata.append("m", _("m").value); 
    var ajax = new XMLHttpRequest(); 
    ajax.open("POST","php/parser.php"); 
    ajax.onreadystatechange = function() { 
     if(ajax.readyState == 4 && ajax.status == 200) { 
      if(ajax.responseText == "success") { 
       alert("Message has been send."); 
      } else { 
       btn.disabled = false; 
      } 
     } 
    } 
    ajax.send (formdata); 
} 

HTML:

<!-- Modal --> 
    <section class="modal" id="myModal"> 
     <!-- Modal content--> 
     <div class="modal-content" id="modal-content"> 
      <img class="modal-home-logo" src="img/logo.png" alt="logo"> 
      <p id="modal-contact-title">Are you intrested in cooperation?</p> 
      <p id="modal-contact-sub-title">Just hit me up via this simple email form !</p> 
      <form id="my_form" onsubmit="submitForm(); return false;"> 
       <p><input id="n" placeholder="Your name - HERE" required></p> 
       <p><input id="e" placeholder="Your email - HERE" type="email" required> </p> 
       <textarea id="m" placeholder="Tell me about your project... what is it? What do you hope to accomplish ? How can i help ? Oh try to ESC if missclicked :)" rows="10" required></textarea> 
       <p><input id="mybtn" type="submit" value="Let's do this !"></p> 
       <p id="modal-contact-sub-title">Awsome thanks !</p> 
      </form> 
     </div> 

    </section> 
    <!-- End Modal --> 

のdocument.getElementByIdは、右のHTMLコンポーネントを返しますが、それはNULLを返しますので、.VALUE機能が動作しません。モーダルをオフにすると、すべてうまく動作します。まあ

あなたはDEVコンソールインチ値= "someText" のdocument.getElementById( 'N')を書く場合、それは動作しますが、のdocument.getElementById( 'N')。常に:(

さて、私のような値のリターンはnull customboxプラグインを削除し、モーダルアニメーションを作った自分自身をそれが今取り組んでいるので

+2

問題を診断するには、HTMLを確認する必要があります。 – gyre

+0

そう、申し訳ありません。 – robertbie

+0

"可能な重複" http://stackoverflow.com/questions/38907748/php-contact-form-reference-errorこの他の質問にも似ているhttp://stackoverflow.com/questions/42352041/how-to-append-list-in-a-php-contact-form – HenryDev

答えて

0

私はカスタムボックスプラグインを削除し、モーダルアニメーションを自分で作成しました。それは今働いている。

0

問題がcustomboxプラグインではありません、FormDataないそれを取得するために、キーデータのみを送信するために作成され さらに詳しい情報:。。。。here

+0

しかし、それがFormDataの問題なら、なぜalert(_( "n")。value);同様にnullを返しますか?関数の先頭に投稿された – robertbie