Try this code
This code will have input tags with values like approved, un-approved, deacitvate instead of app, unapp, deac. Is that okay for you?
And also its better to put the input tag inside the label tag, because when you click the word beside the checkbox, it'll toggle the checkbox (and thats why labels are mostly used for)
As W3schools says:
Proper use of labels with the elements above will benefit:
- Screen reader users (will read out loud the label, when the user is focused on the element)
- Users who have difficulty clicking on very small regions (such as checkboxes) - because when a user clicks the text within the
<label> element, it toggles the input (this increases the hit area).
- Tip: The for attribute of
<label> must be equal to the id attribute of the related element to bind them together. A label can also be bound to an element by placing the element inside the <label> element.
{% for i in range(list_val_len) %}
<label for="val{{ i+1 }}" name="val{{ i+1 }}">
<input type="checkbox" id="val{{ i+1 }}" name="val{{ i+1 }}" value="{{ list_val[i].lower() }}">
{{ list_val[i] }}
</label><br>
{% endfor %}
And also pass the list_val list and its length in seperate keyword arguments on the render_template function like
list_val = ['APPROVED','UN-APPROVED','DEACTIVATE']
@app.route('whatever_route_in_here')
def whatever_name_your_function_has():
...
...
render_template('html_file_name.html', list_val=list_val, list_val_len=len(list_val))
Tell me if its not working...
