Here is a seemingly simple task, creating a form using a set of records so the user can choose which record to go for, all using a radio button.
<form action="" method="GET">{% csrf_token %}
{% for record in select_records %}
<div class="form-check indent-3">
<label class="form-check-label" for="radio{{forloop.counter}}">
<input type="radio" class="form-check-input" id="radio{{forloop.counter}}" name="{{record.get_model_name}}{{record.id}}" value="{{record.record_name}}">
{% if request.user.userprofile.head_shot_thumb %}
<img src="{{ request.user.userprofile.head_shot_thumb }}" alt="Proforma creator">
{% else %}
<div class="h2-li ">
<i class="fas fa-user"></i>
</div>
{% endif %}
{{ record.record_name }} - {{ record.date_created }}
</label>
</div>
{% endfor %}
The problem is that the form creates a list of radio buttons which are all selectable, just like how all the checkboxes are selectable.
I have searched and compared my code to simple radio forms such as the one at W3schools, but I cannot figure it out. Any help is appreciated.
I did small changes in your code. Check it below.
<form action="" method="GET">
{% csrf_token %}
{% for record in select_records %}
<div class="form-check indent-3">
<label class="form-check-label" for="radio{{forloop.counter}}">
<input type="radio" class="form-check-input" id="radio{{forloop.counter}}" name="record-option" value="{{record.record_name}}">
{% if request.user.userprofile.head_shot_thumb %}
<img src="{{ request.user.userprofile.head_shot_thumb }}" alt="Proforma creator">
{% else %}
<div class="h2-li ">
<i class="fas fa-user"></i>
</div>
{% endif %}
{{ record.record_name }} - {{ record.date_created }}
</label>
</div>
{% endfor %}
</form>
I hope this will help you. :)
Related
How do i allow to display a particular form content after the user clicks on checkbox Yes or No
for e.g.if the user clicks on yes checkbox display the form to be filled if user clicks No display another form part to be filled
I want to add it here like in my applyonline.html
{% extends "pmmvyapp/base.html" %}
{% load crispy_forms_tags %}
{% load static %}
{% block content%}
<div class="col-md-8">
<form method="post" action="/add_aganwadi/">
{% csrf_token %}
<div class="form-group">
<div class=" mb-4">
<h6><u>Please Fill up the details below (Note that all the fields are required)</u></h6>
</div>
<legend class="border-bottom mb-4" ,align="center">Beneficiary Details</legend>
<label for="formGropuNameInput">Does Beneficiary have a Driving License Card?*</label>
<div class="form-check form-check-inline">
{% if..... %}
<input class="form-check-input" type="checkbox" id="inlineCheckbox1" value="option1">
<label class="form-check-label" for="inlineCheckbox1">Yes</label>
{% else %}
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="inlineCheckbox2" value="option2">
<label class="form-check-label" for="inlineCheckbox2">No</label>
</div>
</div>
{% endif %}
<button type="submit" class="btn btn-primary" style="margin-bottom:10px ">Submit</button>
</form>
</div>
{% endblock %}
I want to know if I can use the if statement to achieve this and if so how?
if you don't have any problem in including angularjs in form page and radio button instead of check box this below sample code image i used previously will help you
I am getting no value on request in flask. It is returning None value.
I have tried changing the method but no use.
The flask code:
#app.route("/login/user/book")
def searchbook():
bookname=request.form.get("search")
return render_template("message.html",heading=bookname ,message=" ")
The webpage:
{% extends "layout.html" %}
{% block heading %}Welcome to BookSarkar{% endblock %}
{% block body %}
<p>Welcome {{ name }}</p>
<form action="{{ url_for('searchbook') }}" method="get" class="form-group">
<div class="form-group">
<input type="text" name="search" class="form-control col-md-6 mt-5 mx-auto" placeholder="Search books">
<p style="text-align:center;">
<button type ="submit" class="btn btn-primary mt-2 mx-auto">Search</button>
</p>
</div>
</form>
<div class="fixed-top m-2">
<a class="btn btn-outline-primary" href="{{ url_for('logout') }}" role="button" style="float:right;">Log out</a>
</div>
{% endblock %}
The message webpage:
{% extends "layout.html" %}
{% block heading %}{{ heading }}{% endblock %}
{% block body %}
{{ message }}
<a class="btn btn-primary" href="{{ url_for('index') }}" role="button">Return to Home Page</a>
{% endblock %}
The layout page has no bugs as all other pages are working fine. I expected the webpage to show the given input but it is showing None
request.form contains values submitted via post or put, while your form uses get. Try using request.args.get("search") instead of request.form.get("search")
I have a Django form where one of the fields is defined as:
widgets = {
'name': forms.CheckboxSelectMultiple()
}
The template renders them in a loop with:
{% for field in form %}
<fieldset class="article-form__field">
{{ field.label_tag }} {{ field }}
</fieldset>
{% endfor %}
This is rendered as:
<fieldset class="article-form__field">
<label for="category-name_0">Category:</label>
<ul id="category-name">
<li><label for="category-name_0"><input id="category-name_0" name="category-name" type="checkbox" value="GEN" /> General information</label></li>
<li><label for="category-name_1"><input id="category-name_1" name="category-name" type="checkbox" value="FOO" /> Food and drinks</label></li>
</ul>
</fieldset>
In short: <label><input></label>. However, I would like the output to be <label></label><input>.
Is that possible, and if so, how?
Full code is here.
{% for field in form %}
<fieldset class="article-form__field">
{% if field.name != "category-name" %}
{{ field.label_tag }} {{ field }}
{% else %}
{{ field.label_tag }}
<ul id={{ field.auto_id }}>
{% for checkbox in field %}
<li>
<label for="{{ checkbox.id_for_label }}">
{{ checkbox.choice_label }}
</label>
{{ checkbox.tag }}
</li>
{% endfor %}
</ul>
{% endif %}
</fieldset>
{% endfor %}
CheckboxSelectMultiple
RadioSelect (how to customize rendering is described here)
I am using Django Allauth for user flow in my project. I have successfully created my own set of templates which inherit from the standard Allauth templates and they work 95%. For some reason, however, I do not receive an error for an invalid login.
If I enter 'test#email' for the user I get a 'Please enter a valid email address' error but if I enter a proper email with an incorrect password it simply reloads the page but with no errors as to what went wrong. I've included my template below which has the {{ form.login.errors }} and {{ form.password.errors }} tags.
All guidance is appreciated, thank you.
Template:
<div id="search_container">
<div id="search_box_content">
{% block page_content %}
<h4>Login</h4>
<form class="" id="user-form" method="POST" action="{% url 'account_login' %}">
{% csrf_token %}
<h1> {{ form.login.errors }}</h1>
<h1> {{ form.password.errors }}</h1>
<div class="input_class">
<label for="login">Username: </label>
{{ form.login }}
</div>
<div class="input_class">
<label for="password">Password: </label>
{{ form.password }}
</div>
<div class="input_class" id="forgot_pass">
<label for="remember">
Remember Me? </label>
{{ form.remember }}
</div>
{% if redirect_field_value %}
<input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
{% endif %}
<div id="modal_bottom_bar">
<a class="button secondaryAction" id="forgot_pass" href="{% url 'account_reset_password' %}">Forgot your Password?</a>
<button class="primaryAction" id="login_submit" type="submit">Login</button></div>
</form>
{% endblock %}
</div>
</div>
Some errors are non field errors such as those errors which are raised for some custom validation and are not included in field.errors rather they are in form.non_field_errors:
So better use this snippet to show all errors which belongs to fields and to custom validation if you are rendering your form manually:
{% if form.errors %}
{% for field in form %}
{% for error in field.errors %}
<div class="alert alert-error">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endfor %}
{% for error in form.non_field_errors %}
<div class="alert alert-error">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endif %}
I am trying to get the POST values of an .html page that has included pages via {% include %} in Django. However, it returns only the POST from the initial html page.
My inner html that is included has the snippet of code:
div id="edit_parameters">Edit Parameters</div>
<div data-id="{{job.slug}}" id="{{job.slug}}" class="collapse">
<form class = "form-inline" method="post">
{% csrf_token %}
{% for parameter in job.get_object.parameters %}
<p>
<input type="text" class="input-small" name="{{parameter}}" value="" id ="{{parameter}}-input" placeholder="{{parameter}}">
</p>
{% endfor %}
<button type="submit" class="btn btn-primary run-job">Submit</button>
</form>
</div>
{% else %}
<div>
No editable parameters for this job.
</div>
{% endif %}
And my outer HTML file has a snippet:
<ul id="available-jobs">
{% if jobs_same_io_type and jobs_diff_io_type %}<h3> Current Step </h3>
{% elif jobs_same_io_type %} <h3> Next Step </h3> {% endif %}
{% for job in jobs_same_io_type %}
{% include "includes/job_li.html" with add=1 %}
{% endfor %}
{% if jobs_diff_io_type %} <h3> Next Step </h3> {% endif %}
{% for job in jobs_diff_io_type %}
{% include "includes/job_li.html" with add=1 %}
{% endfor %}
{% if not jobs_same_io_type and not jobs_diff_io_type %}
<li class="full-height">There are no more available jobs.</li>
{% endif %}
</ul>
<fieldset class="submit">
{% csrf_token %}
<input type="hidden" name="job_to_run" value="" id="job-to-run" />
<input type="hidden" name="workflow_jobs" value="" id="ordered-jobs" />
<input type="hidden" name="job_to_edit" value="" id="job-to-edit" />
<input type="hidden" name="job_to_add" value="" id="job-to-add" />
<input type="hidden" name="job_to_remove" value="" id="job-to-remove" />
<input type="submit" name="done" value="I'm done, start the jobs" id="jobs-ready" />
</fieldset>
The everything that shows in post is in the inputs of the second snippet. But the parameters I want for the first snippet are not included when I use request.POST for all of the POST values.
Any help would be greatly appreciated in explaining why I am not getting the values from the included page and finding a possible solution. Thanks!
In HTML, only the fields in the form element that contain the submit button are included in the POST. the fields in your second file don't seem to be in any form at all, so they will never be posted.