I am trying to make a custom checkbox such that I can retrieve the value in Flask, but for some reason it is not coming through.
Here is my HTML/CSS/JS:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<style>
* {
margin: 0;
padding: 0;
}
.checkbox {
height: 14px;
width: 14px;
border-radius: 3px;
background-color: #fff;
border: 1px solid black;
cursor: default;
}
.checkbox p {
display: none;
font-size: 12px;
line-height: 14px;
max-height: 14px;
vertical-align: middle;
text-align: center;
color: #777;
}
.checkbox.selected p {
display: block;
}
input[type="checkbox"].hiddencheckbox {
display: none;
}
</style>
</head>
<body>
<form action="" method="post">
<div class="checkbox" onclick="toggleCheck(this)">
<p>✓</p>
<input type="checkbox" name="morning" class="hiddencheckbox">
</div>
<input type="submit" value="Submit">
</form>
</body>
<script type="text/javascript">
function toggleCheck(checkbox) {
var realcheckbox = checkbox.childNodes[1];
checkbox.classList.toggle("selected");
realcheckbox.checked ^= 1;
}
</script>
</html>
And my Python:
from flask import Flask, request, render_template
app = Flask(__name__)
@app.route("/", methods=["POST", "GET"])
def load_checkbox():
if request.method == "POST":
print(request.form)
return render_template("checkbox.html")
if __name__ == "__main__":
app.run(debug=True)
Here is what it prints when I click submit, regardless of the state of the checkbox: ImmutableMultiDict([])
I would like it to print ImmutableMultiDict([('morning', 'on')]) (or similar) if the checkbox is checked, and ImmutableMultiDict([('morning', 'off')]) (or similar) or ImmutableMultiDict([]) if the checkbox is not checked.
What am I missing here? Why is it not working?
Thanks.
Aucun commentaire:
Enregistrer un commentaire