2017-05-19 14 views
0

この特定のケースでは、私はgoogleタグマネージャを使用してブートストラップモーダル内でフォームを送信しています。
私はバックエンドにアクセスできないので、GTMを使用してボタンをターゲットにしてonClickを使用しています。データを送信する前にajax submit postメソッドを確認する

<script> 
$(document).on('submit','#MyForm',function(event){ 
    var form = $('#MyForm'); 
    var submit = $('#ssend_btn'); 
    form.on('submit', function(e) { 
    e.preventDefault(); 
    if($('input', this).val().trim() == '' ){ 
     //handle error message 
     alert("im empty and email will not send"); 
    } 
    else if (submit != 'null'){ 
     event.preventDefault() 
     var formData = $(this).serialize(); 
     console.log(formData); 
     $.ajax({ 
     url: "page.php", // some php 
     data: formData, 
     datatype: "json", 
     type: "POST", 
     success: function(data) { 

     } 
     }); 
    } 
    }); 
}); 
</script> 

電子メールが送信された後、モーダルが閉じてはならないため、これが私がajaxを使用している理由です。
私は電子メールを送信できますが、空白の場合でも送信します。
私はjavascriptで他のバリデーションを行っていますが、それを尊重していません。コンソールログ上

<script> 
function validateForm() { 
    var x = document.forms["myForm"]["EMAIL"].value; 
    var atpos = x.indexOf("@"); 
    var dotpos = x.lastIndexOf("."); 
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length) { 
    error = "testingo"; 
    document.getElementById("errorid").innerHTML = error; 
    return false; 
    } 

</script> 

これは私が電子メールが

+1

スペルを修正するために数分を使用してください。 – OptimusCrime

答えて

1

を送信する方法をwever enter image description here得るものですあなたはこのような何かを探していますか?あなたはバニラJSとjQueryの混合物を使用しているようです。フォームやフォーム入力を参照して、簡単にするために、どちらか一方に固執することをお勧めします。また、入力機能のタイプを「テキスト」ではなく「電子メール」に変更すると、 Chromeの場合など)は、検証ロジックに加えて有効な電子メールが確実に入力されるようにします。

function validateForm() { 
 
    if ($('#EMAIL').val().trim() === '') { 
 
    return false; 
 
    } 
 
    var x = $('#EMAIL').val(); 
 
    var atpos = x.indexOf("@"); 
 
    var dotpos = x.lastIndexOf("."); 
 
    if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) { 
 
    error = "testingo"; 
 
    document.getElementById("errorid").innerHTML = error; 
 
    return false; 
 
    } 
 
    return true; 
 
} 
 

 
$(document).ready(function() { 
 

 
    var form = $('#MyForm'); 
 
    var submit = $('#ssend_btn'); 
 

 
    form.on('submit', function(e) { 
 

 
    e.preventDefault(); 
 

 
    if (validateForm() === false) { 
 
     //handle error message 
 
     alert("im empty and email will not send"); 
 
    } else { 
 
     var formData = $(this).serialize(); 
 
     console.log(formData); 
 
     $.ajax({ 
 
     url: "page.php", // some php 
 
     data: formData, 
 
     datatype: "json", 
 
     type: "POST", 
 
     success: function(data) { 
 

 
     } 
 
     }); 
 
    } 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="MyForm" name="MyForm"> 
 
    <input type="text" name="EMAIL" id="EMAIL" placeholder="EMAIL" /> 
 
    <div id="errorid"></div> 
 
    <input type="submit" id="ssend_btn" value="Submit" /> 
 
</form>

+0

ありがとう、これは私が必要としたものです。 –

+0

問題ありません!お役に立てて嬉しいです! – Woodrow

関連する問題