Python Flask Checkbox Retain Status

Question

I am creating a flask app to control pi gpios. I have some check boxes that i need to retain the state even after page refreshes or when the user leaves the page.

app.py code to render the page

@app.route("/config")
def config():
    return render_template("config.html")

HTML code for checkbox

<form>
    <fieldset class="form-group">
      <legend>Device Configuration</legend>    
      <div class="form-check">
        <label class="form-check-label">
          <input class="form-check-input" type="checkbox" value="" id="check-soil">
          Soil
        </label>
      </div>
    </fieldset>
    <button type="submit" class="btn btn-primary">Update</button>
  </fieldset>
</form>

score 0 · Answer 1 · answered Feb 27 '20 at 20:59

0

you might want to handle it with javascript, adding an event listener to whenever the checkbox changes and calling an async function that sends data back to flask/python

 const checkbox = document.getElementById('check-soil')
 checkbox.addEventListener('change', ()=>{
     asyncFunction()
 })

if you are not familiar with creating async functions, you might want to check this link.

answered Feb 27 '20 at 20:59

Mateus Mecunhe

89
3

I will look into adding javascript, this is a more advanced then where I am at right now but looks like a good solution – Amir Rahimpour Feb 28 '20 at 15:05

score 0 · Answer 2 · answered Feb 28 '20 at 12:55

0

Since you want this to be handled when the page is rendered, ie, server-side, you'll need to do it in the config route.

The ideal way that I can suggest is reading the state of the form on the route which you could pass on to the jinja template as a supporting object.

Now in the section where you have the forms in the template, depending on the check attributes in the supporting objects, you could mark in the HTML as a pre-checked field as follows:

<input class="form-check-input" type="checkbox" value="" id="check-soil" checked>

The checked attribute marks the field as checked when the form is rendered.

answered Feb 28 '20 at 12:55

Saiprasad Balasubramanian

874
7
17

I am trying to build a raspberry pi controller so I would need it to remain checked or unchecked in the back end. would this solution work that way to? – Amir Rahimpour Feb 28 '20 at 15:07
Yes, that's why I suggested a server-side solution instead of client-side using Javascript. Simply check if any fields are filled and pass them on to jinja and mark it as `checked` out there. Then every request would have a persistent checkbox as selected by the user – Saiprasad Balasubramanian Feb 28 '20 at 15:09

Python Flask Checkbox Retain Status

2 Answers2