2017-01-05 13 views
0

ポップアップの表示後に電子メールの値を保存したいと考えています。電子メールの値をポップアップに保存

ユーザは入力に電子メールアドレスを追加し、[購読]をクリックします。しかし、私はMailChimpを使いたくないので、他のフィールド(電話番号のようなもの)でポップアップを開きたいが、前のステップでメールを入力したままMailChimpを使用したい。どうしたらいいですか?最初のボタンをサブスクライブするために

<div class="well"> 
 
    <form action="#"> 
 
     
 
      <div class="row email"> 
 
       <input class="btn btn-lg required_email" name="email" id="email" type="email" placeholder="MY EMAIL TO GET FIRST MY LIFE-TIME PREMIUM ACCESS"> 
 
      </div> 
 
      <div class="row okbutton"> 
 
       <button class="btn btn-info button" data-toggle="modal" data-target="#enquirypopup" type="submit">Subscribe</button> 
 
      </div> 
 
     
 
    </form> 
 
</div> 
 

 
<div id="enquirypopup" class="modal fade in" role="dialog"> 
 
    <div class="modal-dialog"> 
 
     
 
     <!-- Modal content--> 
 
     <div class="modal-content row"> 
 
      <div class="modal-header custom-modal-header"> 
 
       <button type="button" class="close" data-dismiss="modal">×</button> 
 
       <h4 class="modal-title">Enquire Now</h4> 
 
      </div> 
 
      <div class="modal-body"> 
 
       <!-- Begin MailChimp Signup Form --> 
 
        <link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css"> 
 
        <style type="text/css"> 
 
         #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; } 
 
         /* Add your own MailChimp form style overrides in your site stylesheet or in this style block. 
 
          We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */ 
 
        </style> 
 
        <div id="mc_embed_signup"> 
 
         <form action="//FellowsNow.us11.list-manage.com/subscribe/post?u=fa1e6ec5c7d8f4d1f04c123e1&amp;id=c761d217cf" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate> 
 
           <div id="mc_embed_signup_scroll"> 
 
           <h2>Subscribe to our mailing list</h2> 
 
          <div class="indicates-required"><span class="asterisk">*</span> indicates required</div> 
 
          <div class="mc-field-group"> 
 
           <label for="mce-EMAIL">Email Address <span class="asterisk">*</span> 
 
          </label> 
 
           <input type="email" value=" <?php echo $_POST['EMAIL'];?>" name="EMAIL" class="required email" id="mce-EMAIL"> 
 
          </div> 
 
          <div class="mc-field-group"> 
 
           <label for="mce-FNAME">First Name </label> 
 
           <input type="text" value="" name="FNAME" class="" id="mce-FNAME"> 
 
          </div> 
 
          <div class="mc-field-group"> 
 
           <label for="mce-LNAME">Last Name </label> 
 
           <input type="text" value="" name="LNAME" class="" id="mce-LNAME"> 
 
          </div> 
 
          <div class="mc-field-group size1of2"> 
 
           <label for="mce-MMERGE3">Phone Number </label> 
 
           <input type="text" name="MMERGE3" class="" value="" id="mce-MMERGE3"> 
 
          </div> 
 
           <div id="mce-responses" class="clear"> 
 
            <div class="response" id="mce-error-response" style="display:none"></div> 
 
            <div class="response" id="mce-success-response" style="display:none"></div> 
 
           </div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups--> 
 
           <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_fa1e6ec5c7d8f4d1f04c123e1_c761d217cf" tabindex="-1" value=""></div> 
 
           <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div> 
 
           </div> 
 
         </form> 
 
        </div> 
 
        <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='MMERGE3';ftypes[3]='phone';}(jQuery));var $mcj = jQuery.noConflict(true);</script> 
 
      <!--End mc_embed_signup--> 
 
      </div> 
 
      
 
     </div> 
 
     
 
    </div> 
 
</div>

+0

セッション/ Cookieを使用できます。それはオプションです。 –

+0

これに加えて、 'value =" <?php echo $ _POST ['EMAIL'];?> "'は文字としてカウントされます。また、ポスト配列が設定されていて空でないかどうかを確認する必要があります。それはあなたの唯一のPHPですか?おそらくエラーも出ていますが、それらをチェックしているわけではありません。 –

+0

実際、それはテストでした。私は解決策を見つけようとしましたが、はい、うまくいきません。どのようにしてクッキーを使用できますか? –

答えて

0

てみ使用jsのonclickの機能。また、jsやjqueryを使用して電子メールの値を入力します。その後、ポップアップ形式の電子メールフィールドに設定します。

JS:var email = document.getElementById('id_name');

のjQuery:var email = $('#id_name').val();

を入力フィールドに値を設定するには:

JS:document.getElementById("id_name").value = email;

を入力フィールドから値を取得するために

Jquery:$('#id_name').val(email);

<div class="well"> 
       <form action="#"> 

         <div class="row email"> 
          <input class="btn btn-lg required_email" name="email" id="email" type="email" placeholder="MY EMAIL TO GET FIRST MY LIFE-TIME PREMIUM ACCESS"> 
         </div> 
         <div class="row okbutton"> 
          <button class="btn btn-info button" data-toggle="modal" data-target="#enquirypopup" onclick="copyEmail();" >Subscribe</button> 
         </div> 

       </form> 
      </div> 

<div id="enquirypopup" class="modal fade in" role="dialog"> 
     <div class="modal-dialog"> 

      <!-- Modal content--> 
      <div class="modal-content row"> 
       <div class="modal-header custom-modal-header"> 
        <button type="button" class="close" data-dismiss="modal">×</button> 
        <h4 class="modal-title">Enquire Now</h4> 
       </div> 
       <div class="modal-body"> 
        <!-- Begin MailChimp Signup Form --> 
         <link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css"> 
         <style type="text/css"> 
          #mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; } 
          /* Add your own MailChimp form style overrides in your site stylesheet or in this style block. 
           We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */ 
         </style> 
         <div id="mc_embed_signup"> 
          <form action="//FellowsNow.us11.list-manage.com/subscribe/post?u=fa1e6ec5c7d8f4d1f04c123e1&amp;id=c761d217cf" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate> 
            <div id="mc_embed_signup_scroll"> 
            <h2>Subscribe to our mailing list</h2> 
           <div class="indicates-required"><span class="asterisk">*</span> indicates required</div> 
           <div class="mc-field-group"> 
            <label for="mce-EMAIL">Email Address <span class="asterisk">*</span> 
           </label> 
            <input type="email" value=" <?php echo $_POST['EMAIL'];?>" name="EMAIL" class="required email" id="mce-EMAIL"> 
           </div> 
           <div class="mc-field-group"> 
            <label for="mce-FNAME">First Name </label> 
            <input type="text" value="" name="FNAME" class="" id="mce-FNAME"> 
           </div> 
           <div class="mc-field-group"> 
            <label for="mce-LNAME">Last Name </label> 
            <input type="text" value="" name="LNAME" class="" id="mce-LNAME"> 
           </div> 
           <div class="mc-field-group size1of2"> 
            <label for="mce-MMERGE3">Phone Number </label> 
            <input type="text" name="MMERGE3" class="" value="" id="mce-MMERGE3"> 
           </div> 
            <div id="mce-responses" class="clear"> 
             <div class="response" id="mce-error-response" style="display:none"></div> 
             <div class="response" id="mce-success-response" style="display:none"></div> 
            </div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups--> 
            <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_fa1e6ec5c7d8f4d1f04c123e1_c761d217cf" tabindex="-1" value=""></div> 
            <div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div> 
            </div> 
          </form> 
         </div> 
           <script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='MMERGE3';ftypes[3]='phone';}(jQuery));var $mcj = jQuery.noConflict(true);</script> 
<!--End mc_embed_signup--> 
       </div> 

      </div> 

     </div> 
    </div> 


<script type="text/javascript> 
    function copyEmail(){ 
    var email = document.getElementById('email'); 
    document.getElementById("mce-EMAIL").value = email; 
    return true; 

} 
</script> 
+0

私はこのJSコードをどこに置くべきですか? –

+0

html/phpファイルのフッター – Kalaivanan

+0

関連する問題