フォームはIDのメインコンタクトフォームなしで検証されません

Question

私は奇妙な問題を抱えています。私はメールチンパンジーのための購読フォームであるフォームを持っています。フォームは、（それが「これを記入してください」または「電子メールでの@を含めてください」と言うときは）私は

を検証していない場合、私はしかし、その後ID id="main-contact-form"、mailchimpを持っていた場合、それはまた、作品完璧に動作します成功/失敗の返信が新しいタブで開きます。問題は別のタブに移動したくないということです。私はそれを特別にマークされたdivに表示したいのです。どちらがうまくいくか主コンタクトフォームのIDを持っていないが、私が望むバリデーションがない場合。ここで

は、フォームの：

 <form name="mc-embedded-subscribe-form" 
       action="//leilamasson.us7.list-manage.com/subscribe/post?u=0178d0b7b81eec71fd9e2ee9b&amp;id=63fbfa0062" 
       method="post" id="mc-embedded-subscribe-form main-contact-form" 
       target="_blank"> 
      <div class="form-group"> 
       <input type="text" name="FNAME" class="form-control" required="required" 
         placeholder="Name"> 
      </div> 
      <div class="form-group"> 
       <input type="text" name="LNAME" class="form-control" required="required" 
         placeholder="Last Name"> 
      </div> 
      <div class="form-group"> 
       <input type="email" name="EMAIL" class="form-control" required="required" 
         placeholder="Email Adress"> 

      </div> 
      <div id="form-group"> 
       <div class="response" id="mce-error-response" style="display:none"></div> 
       <div class="response" id="mce-success-response" style="display:none"></div> 
      </div> 
      <div class="form-group"> 
       <button type="submit" name="subscribe" class="btn btn-primary pull-right">Subscribe</button> 
      </div> 

      <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" 
                         name="b_0178d0b7b81eec71fd9e2ee9b_63fbfa0062" 
                         tabindex="-1" value=""> 
      </div> 
     </form> 

、ここでは、検証されずに、私が欲しいの形式の例です：

<form action="//leilamasson.us7.list-manage.com/subscribe/post?u=0178d0b7b81eec71fd9e2ee9b&amp;id=63fbfa0062" 
     method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form"> 

    <div class="form-group"> 
     <input type="email" name="EMAIL" class="form-control" required="required" 
       placeholder="Email Adress"> 
    </div> 
    <div class="form-group"> 
     <button type="submit" name="subscribe" class="btn btn-primary pull-right">Subscribe</button> 
    </div> 
    <div id="form-group"> 
     <div class="response" id="mce-error-response" style="display:none"></div> 
     <div class="response" id="mce-success-response" style="display:none"></div> 
    </div> 

</form> 

注：下のフォームは、ID、メイン接点フォームを持っていませんそれはそれが妥当性検査を持つことができません、そして、トップフォームはそれを新しいタブで開くようにするIDメインコンタクトフォームを持っています。

問題は、ソーシャルセクションのleila.moussaieff.infoにライブで見ることができます。

Answer 1

あなたはIDにスペースを持つことはできません - これはeffecively部分を分割し、問題が発生します。

...id="mc-embedded-subscribe-form main-contact-form"... 

は（追加アンダースコア）のようになります。

...id="mc-embedded-subscribe-form_main-contact-form"... 

また、実際には、入力のIDをxyzとしたfor = "xyz"の入力用のラベルが必要です。これにより、スクリーンリーダーはラベルを特定の入力に結び付けることができます。

...<div id="form-group"> 
    <div class="response"... 

はさておきとしても

...<div class="form-group"> 
    <div class="response"... 

する必要があります - ではなく：他のすべてのフォームグループのクラスを持っている場合 - エラーのためにあなたのdivは、フォーム・グループのIDを持っていることを

注意

<input type="hidden" name="b_0178d0b7b81eec71fd9e2ee9b_63fbfa0062" value="" />