Strange block/extends interaction going on in Django - python

so in my home page I extend from 2 things, based on whether or not the user is signed in or not. Then, if they have TRIED to sign in, and failed, i want the inputs to be red:
{% extends extendVar %} #in this case, extendvar=notLoggedIn.html
{% block signIn %}
{% if failure %}
<div class="form-group has-error">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group has-error">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>
{% endif %}
{% endblock %}
notLoggedIn.html then includes from a header page:
<div class="container" style="">
{% include 'header.html' %}
</div>
And this has a block tag:
<div class="header clearfix">
<nav>
<ul class="nav nav-pills pull-left">
<a class="" href="#">
<img alt="Brand" src="{% static 'images/Logo.png' %}" style="height:auto; max-width:470px; margin-top:-22px; margin-bottom:-30px; padding-right:10px;">
</a>
</ul>
<ul class="nav nav-pills pull-right">
<div id="navbar" class="navbar-collapse collapse">
<form class="navbar-form navbar-right" action="{% url 'signIn' %}" method="POST">
{% csrf_token %}
{% block signIn %}
<div class="form-group">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>
<button class="btn btn-primary btn" href="" role="button" style="">Sign in </button>
{% endblock %}
</form>
</div>
</ul>
</nav>
Project name</h3> -->
my only problem is that because i am including header in NotLoggedIn, and then extending that, it doesnt preserve the block tags, and so the signIn blocks are not working. If instead of doing include header, i merely hard-code it, the blocks work perfectly. Any ideas?

According to the django documentation, when you use "include", blocks in the included template are evaluated first, and then substituted in. So in your template, you can't override a block of the included template.
https://docs.djangoproject.com/es/1.9/ref/templates/builtins/#include
Instead of using a block, what if you pass variables down to the include block, to get it to render how you want? For example:
Your template:
{% include 'header.html' with failure=failure %}
header.html:
<div class="form-group {% if failure %}has-error{% endif %}">
<input type="email" id="email" name="email" placeholder="Email" class="form-control">
</div>
<div class="form-group {% if failure %}has-error{% endif %}">
<input type="password" name="password" placeholder="Password" class="form-control">
</div>

Related

Django POST method is not receiving all input fields from HTML

please I would like to ask for help. I'm creating a web-based application and I'm having a hard time when I try to get the data from the HTML form and receive it through the POST method in Django.
It's pulling data only from one field and I really appreciate your help in figuring out why it's not pulling information from the other fields only from the location field. Thank you very much!
HTML = create-request.html
<form action="{% url 'save_request' %}" id="checklistForm" name="checklistForm" enctype="multipart/form-data" method="POST">
{% csrf_token %}
<section id="step-1" class="form-step">
<div class="mt-3">
{% include 'home/1_resource-request.html' %}
</div>
</section>
</form>
HTML = home/1_resource-request.html
{% block stylesheets %}{% endblock stylesheets %} {% block content %}
<div class="pcoded-content">
<div class="pcoded-inner-content">
<div class="main-body">
<div class="page-wrapper">
<div class="row">
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Resource Request</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<form>
<div class="form-group">
<label for="checklistID">Checklist Number</label>
<input type="text" class="form-control" id="checklistID" name="checklistnum" placeholder="123456" disabled/>
</div>
<div class="form-group">
<label for="location_ID">CMPA Location</label>
<select class="form-control" id="location_ID" name="location">
<option selected>Select</option>
<option>Brazil</option>
<option>Canada</option>
<option>Mexico</option>
<option>SSA</option>
<option>United States</option>
</select>
</div>
</form>
</div>
<div class="col-md-6">
<form>
<div class="form-group">
<label for="support_id">CMPA Support Needed</label>
<select class="form-control" id="support_id" name="support">
<option selected>Select</option>
<option>Both</option>
<option>PMA - Financial Management</option>
<option>PMO - Project Administration</option>
</select>
</div>
<div class="form-group">
<label for="band_pma_id">Band (PMA)</label>
<select class="form-control" id="band_pma_id" name="band_pma">
<option selected>Select</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
<small id="textInfo1" class="form-text text-muted">There is no B4 for US and CA - in progress.</small>
</div>
<div class="form-group">
<label for="band_pmo_id">Band (PMO)</label>
<select class="form-control" id="band_pmo_id" name="band_pmo">
<option selected>Select</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
<small id="textInfo2" class="form-text text-muted"
>There is no B4 for US and CA - in progress.</small
>
</div>
<div class="mt-3">
<button class="button btn-navigate-form-step" type="button" step_number="2">Next</button>
<button class="button2 btn btn-outline-primary " type="submit">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock content %}
Django/Python = views.py
def save_request(request):
#print(request.POST)
if request.method == 'POST':
context = {}
location = request.POST.get('location', None)
support = request.POST.get('support', None)
band_PMA = request.POST.get('bandPMA', None)
band_PMO = request.POST.get('bandPMO', None)
ippf = request.POST.get('ippf', None)
print(location, support, band_PMA, band_PMO, ippf)
return render(request, 'home/create-request.html', context=context)
That html defines many different forms. The first form has the location input element, the second form has the support input element, and so on.
Only one form can be submitted at a time. By default it is the first form on the page, so that's why you only see the location element.
I think you need to rewrite the html to have only one form.
That is because you have many tags.
You need to keep only one, the one wrapping your include, so do that :
<form action="{% url 'save_request' %}" id="checklistForm" name="checklistForm" enctype="multipart/form-data" method="POST">
{% csrf_token %}
<section id="step-1" class="form-step">
<div class="mt-3">
{% include 'home/1_resource-request.html' %}
</div>
</section>
</form>
and that :
HTML = home/1_resource-request.html
{% block stylesheets %}{% endblock stylesheets %} {% block content %}
<div class="pcoded-content">
<div class="pcoded-inner-content">
<div class="main-body">
<div class="page-wrapper">
<div class="row">
<div class="col-sm-12">
<div class="card">
<div class="card-header">
<h5>Resource Request</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label for="checklistID">Checklist Number</label>
<input type="text" class="form-control" id="checklistID" name="checklistnum" placeholder="123456" disabled/>
</div>
<div class="form-group">
<label for="location_ID">CMPA Location</label>
<select class="form-control" id="location_ID" name="location">
<option selected>Select</option>
<option>Brazil</option>
<option>Canada</option>
<option>Mexico</option>
<option>SSA</option>
<option>United States</option>
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label for="support_id">CMPA Support Needed</label>
<select class="form-control" id="support_id" name="support">
<option selected>Select</option>
<option>Both</option>
<option>PMA - Financial Management</option>
<option>PMO - Project Administration</option>
</select>
</div>
<div class="form-group">
<label for="band_pma_id">Band (PMA)</label>
<select class="form-control" id="band_pma_id" name="band_pma">
<option selected>Select</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
<small id="textInfo1" class="form-text text-muted">There is no B4 for US and CA - in progress.</small>
</div>
<div class="form-group">
<label for="band_pmo_id">Band (PMO)</label>
<select class="form-control" id="band_pmo_id" name="band_pmo">
<option selected>Select</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
</select>
<small id="textInfo2" class="form-text text-muted"
>There is no B4 for US and CA - in progress.</small
>
</div>
<div class="mt-3">
<button class="button btn-navigate-form-step" type="button" step_number="2">Next</button>
<button class="button2 btn btn-outline-primary " type="submit">Save</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock content %}

Form errors are displayed at the wrong place

I am working on my Blog website and in the registration template I should insert the username and email and password so I can register but if i have an error it should give me what is it BUT every error I have it goes to the bottom of the template, not under the field I want.
P.S.: I am using Django framework!!
template.html:
<h1>Register</h1>
<form action="" method="post">
{% csrf_token %}
<div class="form-floating mb-3">
<input type="text" class="form-control" id="floatingInput" placeholder="name#example.com" name="username">
<label for="floatingInput">Username</label>
</div>
<div class="form-floating mb-3">
<input type="email" class="form-control" id="floatingInput" placeholder="name#example.com" name="email">
<label for="floatingInput">Email</label>
</div>
<div class="form-floating">
<input type="password" class="form-control" id="floatingPassword" placeholder="Password" name="password1">
<label for="floatingPassword">Password</label>
</div>
<div class="form-floating">
<input type="password" class="form-control mt-3" id="floatingPassword" placeholder="Password" name="password2">
<label for="floatingPassword">Re-Type Password</label>
</div>
{% if forms.errors %}
{% for field in forms %}
{% for error in field.errors %}
<h5 style="color: red;">{{ error|escape }}</h5>
{% endfor %}
{% endfor %}
{% for error in forms.non_field_errors %}
<h5 style="color: red;">{{ error|escape }}</h5>
{% endfor %}
{% endif %} <br>
<button type="submit">Register</button>
</form>
</div>
if anything needs to be added other then the template please tell me in the comment!!
Thanks in advance!! <3
You render the field errors at the bottom as well, hence the error. In order to render the errors of a specific field, you should iterate over the errors of that field, so:
<div class="form-floating mb-3">
{% for error in forms.username.errors %}
<h5 style="color: red;">{{ error|escape }}</h5>
{% endfor %}
<input type="text" class="form-control" id="floatingInput" placeholder="name#example.com" name="username">
<label for="floatingInput">Username</label>
</div>
and this for all fields of course.

How do I get images to show on my django app?

On my Django app, I am trying to make an eBay type of site that lets people post listings with pictures and bid on them. Everything works except posting an image. The image won't show and I do not know if it's the HTML or the python. If you have any questions let me know.
Html code:
{% extends "auctions/layout.html" %}
{% block body %}
<div class="container">
<h2>Create listing</h2>
</div>
<div class="container">
<form action="{% url 'submit' %}" method="POST">
{% csrf_token %}
<div class="form-group">
<label for="exampleFormControlInput1">Title</label>
<input type="text" class="form-control" id="exampleFormControlInput1" placeholder="Title of the lisiting..." name="title" required>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">Description</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="5" placeholder="Description..." name="description" required></textarea>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">Category</label>
<select class="form-control" id="exampleFormControlSelect1" name="category" required>
<option>Fashion</option>
<option>Tools</option>
<option>Toys</option>
<option>Electronics</option>
<option>Home accessories</option>
<option>Books</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Initial Bid</label>
<input type="number" class="form-control" id="exampleFormControlInput1" placeholder="Starting bid..." name="price" required>
</div>
<div class="form-group">
<label for="exampleFormControlInput1">Image link (optional)</label>
<input type="text" class="form-control" id="exampleFormControlInput1" placeholder="https://blah-blah.jpg..." name="link">
</div>
<button class="btn btn-outline-info" type="submit">Submit</button>
</form>
</div>
{% endblock %}
This is the python function for making listings:
def create(request):
try:
w = Watchlist.objects.filter(user=request.user.username)
wcount=len(w)
except:
wcount=None
return render(request,"auctions/create.html",{
"wcount":wcount
})

Django-messages works only when form|crispy is used but not in other cases

I am creating a login page using django but it does not show any messages when I enter wrong passwords or email addresses. I've also checked other messages but it didn't help.
login.html
<div class="right">
<h2>Login</h2>
{% if messages %}
{% for message in messages %}
<div class="alert alert-{{ message.tags }}">
{{ message }}
</div>
{% endfor %}
{% endif %}
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<div class="field">
<div class="label">Email or Username</div>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="field">
<div class="label">Password</div>
<input type="password" name="password" id="password" class="form-control">
</div>
<button class="login" type="submit">LOGIN</button>
</fieldset>
</form>
<div class="sign_up">
<small>Don’t have an account yet?</small>
<a class="signup" href="{% url 'register' %}">SIGN UP</a>
</div>
</div>
urls.py has this path for the login page(I have imported all the necessary classes):
path('login/', auth_views.LoginView.as_view(template_name='users/login.html') , name='login'),
But the messages are shown when I use this form|crispy in login.html
<div class="content-section">
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<legend class="border-bottom mb-4">Login</legend>
{{ form|crispy }}
</fieldset>
<div class="form-group">
<button class="btn btn-outline-info" type="submit">Sign In</button>
</div>
</form>
<div class="border-top pt-3">
<small class="muted-text">
Want a new Account? <a class="ml-1" href="{% url 'register' %}">Sign Up</a>
</small>
</div>
</div>
Here you used LoginView using form it will return it will show you error because of {{ form|crispy }} template tag render form and fields along with field.errors and field.non_field_error.
That's Why you can get an error message if you remove message block in your code it will show you an error there is no connection with form and message in login view
If you want to render you HTML form with CSS you need to explicitly define errors showing block like this
<div class="right">
<h2>Login</h2>
{% if form.errors %}
{% for field in form %}
{% for error in field.errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endfor %}
{% for error in form.non_field_errors %}
<div class="alert alert-danger">
<strong>{{ error|escape }}</strong>
</div>
{% endfor %}
{% endif %}
<form method="POST">
{% csrf_token %}
<fieldset class="form-group">
<div class="field">
<div class="label">Email or Username</div>
<input type="text" name="username" id="username" class="form-control">
</div>
<div class="field">
<div class="label">Password</div>
<input type="password" name="password" id="password" class="form-control">
</div>
<button class="login" type="submit">LOGIN</button>
</fieldset>
</form>
<div class="sign_up">
<small>Don’t have an account yet?</small>
<a class="signup" href="{% url 'register' %}">SIGN UP</a>
</div>
</div>
Here not meaning to use the message framework of Django. Form it self return error in his errors attribute of a form
Hope you satisfied with this answer

Get the dropdown data and update the data in Django

Dear all of the Django developer community, I am facing this below issue:
I try to update a db table data which has one field and one drop down field. But I only get basic field data and not drop down list data.
I request expert help me. How can I fix this issue?
Advanced Thanks For All
views.py
def update_brands(request, id):
brand = Brand.objects.get(id=id)
form = AddBrandForms(request.POST, instance=brand)
if form.is_valid():
form.save()
return redirect('/parts/brands')
return render(request, 'parts/edit_brands.html', {'brand': brand })
edit_brands.html
{% extends 'parts/base.html' %}
{% block content %}
<form method="post" action="/parts/update_brands/{{brand.id}}/" class="post-form">
{% csrf_token %}
<div class="form-group row">
<label class="col-sm-2 col-form-label">Country Name:</label>
<div class="col-sm-4">
<input type="text" name="country" value="{{ brand.brand_name }}"/>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Country Name:</label>
<div class="col-sm-4">
<select id="cars" name="cars">
{% for db in dbf.all %}
<option value="{{ db.db}}">{{ db.db}}</option>
{% endfor %}
</select>
</div>
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
{% endblock %}
try this
{% extends 'parts/base.html' %}
{% block content %}
<form method="post" action="/parts/update_brands/{{brand.id}}/" class="post-form">
{% csrf_token %}
<div class="form-group row">
<label class="col-sm-2 col-form-label">Country Name:</label>
<div class="col-sm-4">
<input type="text" name="country" value="{{ brand.brand_name }}"/>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">Country Name:</label>
<div class="col-sm-4">
<select id="cars" name="cars">
{% for car in brand.all %}
<option value="{{ car }}">{{ car }}</option>
{% endfor %}
</select>
</div>
</div>
<button type="submit" class="btn btn-success">Submit</button>
</form>
{% endblock %}

Categories