ポップオーバーがポップオーバーするとフォームの値が消えます

Question

フォーム内にブートストラップポップオーバーを使用して、特定のユーザーのみに適用されるオプションを表示しています。私は、ポップオーバーが閉じられ、2つのラジオボタンのフォーム入力がフォームの提出に含まれないと、フォーム選択（はいまたはいいえラジオボタンオプション）が失われるという問題に気付きました。

ポップオーバーを開いたままにしてフォームを送信すると、すべて正常に機能しますが、ユーザーがポップオーバーを開いたままフォームを送信することはできません。

は、ここにHTMLです：

<form> 
 

 
    <div class="form-group"> 
 
    <label class="control-label col-sm-3"></label> 
 
    <div class="input-group col-xs-8"> 
 
     <button class="btn btn-default pull-right" id="settings" type="button"><span class="glyphicon glyphicon-cog"></span> Settings</button> 
 
    </div> 
 
    </div> 
 
    </div> 
 

 
    <div id="userSettings" class="hide"> 
 
    <div> 
 
     <label for="includeEmail">Include in Email</label> 
 
     <div class="radio"> 
 
     <label> 
 
      <input type="radio" name="includeEmail" value="Yes">Yes</label> 
 
     &nbsp; 
 
     <label> 
 
      <input type="radio" name="includeEmail" value="No" checked="checked">No</label> 
 
     &nbsp; 
 
     </div> 
 
    </div> 
 
    <br /> 
 
    <div> 
 
     <label for="includeSMS">Include in SMS</label> 
 
     <div class="radio"> 
 
     <label> 
 
      <input type="radio" name="includeSMS" value="Yes">Yes</label> 
 
     &nbsp; 
 
     <label> 
 
      <input type="radio" name="includeSMS" value="No" checked="checked">No</label> 
 
     &nbsp; 
 
     </div> 
 
    </div> 
 
    </div> 
 

 
</form>

、ここではスクリプトです：

<script> 
 
    $(function() { 
 
    $('#settings').popover({ 
 
     placement: 'top', 
 
     html: true, 
 
     content: $('#userSettings').html() 
 
    }) 
 
    }) < /script>

ポップオーバーCLを持ってする方法はあります選択を失うことなくオセ？

Answer 1

入力が表示されない場合は、フォーム送信の一部として送信されません。あなたはこれらの値を送信し、ポップオーバーを使用したい場合は解決策は以下のとおりです。

1. あなたはポップアップdivの外に、フォーム内にあるこれらの値を、送信するために使用される隠しフォームフィールドを追加することができます。

2. 各ラジオボタンの変更に応じて、対応する非表示の入力フィールド値を更新します。今

ユーザーがポップオーバー開いて提出した場合、それはポップオーバーは、フォーム内であれば、あなたがこの出来事をしたくない場合、あなたは常にフォームの外に移動することができ、二回この情報が送信されます。あなたのユースケースによって異なります。