title: bootstrap popover: put values into multiple textboxes with one popover
body: <p>I have run into a weird bootstrap popover issue. In my page I have 2 text boxes with buttons that opens a popover. Popover has an input box and when data is entered into the text box within popover, value needs to sent back to the parent text box that opened the popover.</p>
  
  <p>Everything works fine until here, but when i click on to submit the value I entered in the popover, same values are added to both the text boxes in the page. Below is the code:</p>
  
  <pre><code>&lt;script type="text/javascript" language="javascript"&gt;
      $(document).ready(function () {
          $('.showPopover').popover({
              html: true,
              placement: "bottom",
              title: function () {
                  return $("#popover-head").html();
              },
              content: function () {
                  return $("#popover-content").html();
              }
          });
          $('.showPopover').click(function () {
              var cTextBox = '#' + $(this).prev().attr("id");
              $('#hdnCalculatefteFor').val(cTextBox);
          });
  
          $(document).on("click", ".close", function () {
              $(".showPopover").popover('hide');
          });
  
          $(document).on("click", ".getData", function () {
              var ctl = $('#hdnCalculatefteFor').val();
              var ctlInput = $('#input1').val();
              $(ctl).val(ctlInput);
          });
      });
  &lt;/script&gt;
  &lt;div class="row"&gt;
      &lt;div class="col-md-2"&gt;
          &lt;div id="div1" class="form-group"&gt;
              &lt;label class="required"&gt;Text Box 1&lt;/label&gt;
              &lt;div class="input-group"&gt;
                  &lt;asp:TextBox ID="txt1" runat="server" class="form-control" ClientIDMode="Static"&gt;&lt;/asp:TextBox&gt;
                  &lt;span id="s1" style="cursor:pointer;" class="form-control showPopover" &gt;
                          &lt;i class="icon-list"&gt;&lt;/i&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="col-md-2"&gt;
          &lt;div id="div2" class="form-group"&gt;
              &lt;label class="required"&gt;Text Box 2&lt;/label&gt;
              &lt;div class="input-group"&gt;
                  &lt;asp:TextBox ID="txt2" runat="server" class="form-control" ClientIDMode="Static"&gt;&lt;/asp:TextBox&gt;
                  &lt;span id="s2" style="cursor:pointer;" class="form-control showPopover"&gt;
                      &lt;i class="icon-list"&gt;&lt;/i&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;asp:HiddenField ID="hdnCalculatefteFor" ClientIDMode="Static" runat="server" /&gt;
  &lt;div id="popover-head" class="hide" &gt;
      Test
      &lt;button type="button" class="close" data-dismiss="popover" aria-hidden="true"&gt;×&lt;/button&gt;
  &lt;/div&gt;
  &lt;div id="popover-content" class="hide"&gt;
      &lt;input type="text" id="input1" /&gt;                
      &lt;button type="button" id="btn" class="getData" value="Get"&gt;&lt;/button&gt;    
  &lt;/div&gt;
  </code></pre>
  
  <p>Any suggestions on how to solve this problem?</p>
  
  <p>Thanks,
  Navin</p>