store html checkbox value into list using flask, jinja2

Tags: , , , ,



I’m in need of some help. I am using flask and I have had an HTML page with a bunch of checkboxes. They are ordered as option1, option2, and option3 and then under the options, there are a number of boxes to check. I am trying to keep track of what all boxes have been checked for which option and store that information into a list.

currently my logic is to use some for loop within the HTML file using Jinja2 and try to set some unique name tag in the form such as name=”{{getboxitem}}” However my logic is only working vertically across option1 but its not able to track if I have checked a box in option2 and option3. Is there any suggestions that could help resolve this.

Also, one other strange thing about this is I can clearly see the name of my checkbox form is “option2checkbox1” however in the python route when I request this via request. forms its setting to none as if the value is not existing.

Example:

Option1              Option2              Option3
-------------        --------------       -----------
    [] Not Checked      []not checked        [*]Checked
    [*] Checked         [*]not checked       [*]Checked





@app.route('/performance_features_ixia', methods=['GET', 'POST'])
def performance_features_ixia():


    option2checkbox1 = request.form.get('option2checkbox1')
    print('option2checkbox1 is {}'.format(option2checkbox1))

Here is my HTML file

{% for items in rtr_intfs %}

        {% set getboxitem = items + 'checkbox1' %}


     <div class="col-sm-3">

        {%if loop.index > 4 %}
          <br><br>
        {% endif %}

      <p>{{items}}</p>
      <hr style="border: 2px solid#5b9aa0;" />
      <div id="checkboxes">

       <form role="form" action="{{ url_for('performance_features_ixia') }}" name='checkboxform' method="POST" >

        <ul name="listformcheckbox">
            <li>
                <div class="checkbox form-check">
                    <input type="checkbox" name="{{getboxitem}}" id='myCheck' class="check ingress-check form-check-input"> check box option
                    </label>
                </div>
            </li>
        </ul>

         {% if loop.index == 1%}
         <br>
            <button class="btn btn-info btn-lg" type="submit">Submit</button>
        {% endif %}

        </form>
    </div>

</div>

    {% endfor %}

Answer

The Answer was to move the for loop under the form. After debugging I realized I was creating three form’s so looks like when I do the request.form.get it was not in the form it was looking for.

    {% for items in rtr_intfs %}




         <div class="col-sm-3">

            {%if loop.index > 4 %}
              <br><br>
            {% endif %}

          <p>{{items}}</p>
          <hr style="border: 2px solid#5b9aa0;" />
          <div id="checkboxes">

           <form role="form" action="{{ url_for('performance_features_ixia') }}" 
name='checkboxform' method="POST" >
{% set getboxitem = items + 'checkbox1' %}

            <ul name="listformcheckbox">
                <li>
                    <div class="checkbox form-check">
                        <input type="checkbox" name="{{getboxitem}}" id='myCheck' class="check ingress-check form-check-input"> check box option
                        </label>
                    </div>
                </li>
            </ul>

             {% if loop.index == 1%}
             <br>
                <button class="btn btn-info btn-lg" type="submit">Submit</button>
            {% endif %}
{% endfor %}


            </form>
        </div>

    </div>


Source: stackoverflow