Flask doesn't return a boolean checkbox value

Question

I'm looking for a solutions for my problem from 1 weeks, but i don't understand where is the right point to change my code. I want checkbox to return a boolean value in flask code. Below are the related code snippets:

mycode.py

import os, sqlite3

from flask import Flask, flash, request, render_template, send_from_directory, g, session, abort, redirect, url_for
from random import randint
from tkinter.messagebox import *

import os, sqlite3

app = Flask(__name__)

app.config.from_object(__name__)

@app.route('/')
def home():
    return render_template('appvolti1.html')


@app.route('/filter')
def viewdb():
    global list1
    bool_occhiali_checked = request.form.get('occhiali')

    if bool_occhiali_checked:
        list1 = ["Hello", "World"]
    else:
        list1 = ["Oh no", "don't work"]

    return newpage()


@app.route('/newpage')
def newpage():
    return render_template('filter.html', listaimmagini = list1)


if __name__ == '__main__':
    app.debug = True
    app.run()

appvolti1.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Riconoscimento volti</title>
<style>
@import url(http://fonts.googleapis.com/css?family=Exo:100,200,400);
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:700,400,300);

    body{
        background: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.65)); /* For Safari 5.1 to 6.0 */
        background: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.65)); /* For Opera 11.1 to 12.0 */
        background: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.65)); /* For Firefox 3.6 to 15 */
        background: rgb(230, 230, 230); /* Standard syntax */

    }
    .div1{
        margin:0 auto;
        width:1400px;
        display:block;
    }
    .subdiv1{
        display: inline-flex;
        display: -webkit-inline-flex;
        width: 100%;
    }
    .subdiv2{
        margin: 0 auto;
        display: table;
        height: 200px!important;
    }
    .subdiv3{
        width:40%;
        margin: 0 auto;
        display: table;
    }   

    .invia{
        display: table-cell;
        vertical-align: bottom;
        padding: 120px;/*qui gli elementi sono tutti importanti, ti ho lasciato il padding per farlo staccare dalla parte inferiore del contenitore*/
    }


    .invia input[type=button]{
        width: 160px;
        height: 35px;
        background: #597ef9;
        border: 1px silver;
        cursor: pointer;
        border-radius: 2px;
        color: #fff;
        font-family: 'Exo', sans-serif;
        font-size: 16px;
        font-weight: 400;
        padding: 6px;
        margin-top:100%;
    }


    .invia input[type=button]:hover{
    opacity: 0.8;
    }

    .invia input[type=button]:active{
        opacity: 0.6;
    }

    .invia input[type=text]:focus{
        outline: none;
        border: 1px solid rgba(255,255,255,0.9);
    }


    .invia input[type=password]:focus{
        outline: none;
        border: 1px solid rgba(255,255,255,0.9);
    }


    .invia input[type=button]:focus{
        outline: none;
    }
    .checkbox{
        margin-left: 50%;
        width: 160px;
    }
    .checkbox div{
        color: #5379fa;
        font-family: 'Exo', sans-serif;
        font-size: 15px;
        font-weight:bold;
    }
    .checkbox div span{
        color: #fff !important;
    }   


</style>
</head>
<body>
    <div class="div1">
        <div class="subdiv1">
            <div class="subdiv2">

            <div class="subdiv3" style="width:20%;margin-right:0px;">
                                <div style="position:relative;">

                <div class= "checkbox">
                    <div><span>Caratteristiche</span></div>
<div><input type="checkbox" name="occhiali">Occhiali</div> 


</div>

</div>
                <div class="invia" style="margin: 0 auto;" >
                    <input type="button" value="Applica filtri" style="margin-left: -125%;" onclick="location.href = 'http://127.0.0.1:5000/filter';"> 
                </div>
        </div>
    </div>
    </div>
</body>

</html>

filter.html

<!DOCTYPE html>
<html>
<head>
<style>
    body{

        background: rgb(230, 230, 230); /* Standard syntax */
    }
</style>
</head>

<body>

  {{listaimmagini}}

</body>
</html>

What did it return, could you print bool_occhiali_checked after get and paste what on your console / terminal — Phung Duy Phong
– Phung Duy Phong, Commented May 26, 2017 at 10:17
Button onclick clearly indicating that you redirected the page to /filter but request.form only populates when POST method to /filter — Raja Simon
– Raja Simon, Commented May 26, 2017 at 10:19

Pradeepb · Accepted Answer · 2017-05-26 10:55:26Z

2

You have wrap the form tag with post method and with submit button. So instead of submit button with onclick this will make the POST request to the server...

<form action="." method="post">
  <input type="checkbox" name="occhiali">
  <input type="submit" value="submit">
</form>

then in your view function add this...

if request.method == "POST":
    is_checked = request.form.get('occhiali')

edited May 26, 2017 at 10:55

Pradeepb

2,5723 gold badges28 silver badges48 bronze badges

answered May 26, 2017 at 10:23

Raja Simon

10.3k5 gold badges46 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Flask doesn't return a boolean checkbox value

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related