title: How to pass a list of checked checkboxes through confirm modal JQuery Flask
body: <p>I am trying to create a page where user can delete multiple records. These records are in a table and are generated via jinja2 for loop. Each one has a checkbox as a table row with record_id as a value. Where I'm stuck is trying to pass a list of checked values (record_ids) to a modal. 
  While I was able to pass variables to modal either via modal id field or data-yourparameter, I can't seem to find a way to pass a list of values that were checked. I think the trick is somewhere in JQuery, but I know very little of it.
  My goal is to somehow pass this list of values of checked checkboxes to pass_checkedvalue input in the modal.</p>
  
  <p>Any help is greatly appreciated! </p>
  
  <p>Here is what I have tried so far:</p>
  
  <p>HTML:</p>
  
  <pre><code> &lt;form name="table-form" method="POST"&gt;
    {% for record in table %}
      &lt;tr&gt;
      &lt;td&gt; &lt;input type="checkbox" name="checked[]" value="{{ record.id }}"&gt; 
      &lt;/td&gt;
      &lt;td&gt;{{record.name}}&lt;/td&gt;
      &lt;/tr&gt;
      {% endfor %}
      &lt;a data-toggle="modal" class="btn btn-primary" id="btn_multidelete" value="btn_display_value" data-target="#multiconfirm-modal"&gt; Delete selected&lt;/a&gt;
      &lt;/form&gt;
  
  
  &lt;!-- Modal for Confirm Multi-Delete popup--&gt;
  &lt;div class="modal" tabindex="-1" role="dialog" id="multiconfirm-modal"&gt;
  &lt;div class="modal-dialog" role="document"&gt;
  &lt;div class="modal-content"&gt;
  &lt;div class="modal-header"&gt;
  &lt;h5 class="modal-title"&gt;Confirm&lt;/h5&gt;
  &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
  &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
  &lt;/button&gt;
  &lt;/div&gt;
  &lt;div class="modal-body"&gt;
  &lt;p&gt;Are you sure you want to delete these API users?&lt;/p&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer align-items-start"&gt;
  &lt;button type="button" class="btn btn-secondary" data-dismiss="modal"&gt;Cancel&lt;/button&gt;
  &lt;form action="{{ url_for('multidelete') }}" method="POST"&gt;
  &lt;input name="pass_checkedvalue" type="hidden" value="pass_checkedvalue" id="hidden_checkedinput"&gt;
  &lt;input class="btn btn-secondary" type="submit" name="submit_button" value="Confirm"&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JQuery script:</p>
  
  <pre><code>&lt;!-- This script allows checked values to be passed to multi-confirm modal  --&gt;
  &lt;script&gt;
  $('#multiconfirm-modal').on('show.bs.modal', function(e) {
  var checkedvalue = $('.checked[]:checked').val();
  $('#hidden_checkedinput').val(checkedvalue)
  });
  </code></pre>
  
  <p></p>