There is already a subscribe field in my html page.
I don't want to create another django form.
how can I send data from here?
<div class="input-group">
<span class="input-group-addon fh5co_footer_text_box" id="basic-addon1"><i class="fa fa-envelope"></i></span>
<input type="text" class="form-control fh5co_footer_text_box" placeholder="Enter your email..." aria-describedby="basic-addon1">
<i class="fa fa-paper-plane-o"></i> Subscribe
</div>
You can put your code inside form tags that points to your django view:
<form action="url_of_your_view" method="post">
{% csrf_token %}
</form>
and you can get the data in your view using request.POST but don't forget the {% csrf_token %} in your form.
Related
I have a web page that I have to connect with Django. So I have an existing form with input and submit button. I have created a model and form. I put {{form}} tag and a little unstyled form appeared. but I want to grab a data from the one in HTML file. The code:
form file:
class NumberForm(ModelForm):
class Meta:
model = Number
fields = "__all__"
HTML:
<form action="#" method="post">
{% csrf_token %}
{{ form }}
<div class="line>
<input type="text" class="form-control" name="phoneNumber" id="phoneNumber2" value="" placeholder="+7 (___) ___-__-__">
<button class="button_blue">t</button>
</div>
<label class="container_checkbox">
<input type="checkbox" checked="checked">
<span class="checkmark"></span>
</label>
</form>
I am working on a job portal system. I provide users the chance to edit their profiles by adding and removing job experiences. The issue is I don't know how to send that data to the view so that it can retrieve all the fields and store them in the database accordingly. By retrieving, I mean for each job experience, retrieve their corresponding sub fields
Here is my template file:
<!--JOB EXPERIENCE-->
<div class="job_experience">
<h5>Experience</h5>
<hr>
<!--FORM-->
<form action="#" id="save_job_experience_form" method="POST">
{% csrf_token %}
<div class="job_container">
{% for job in job_experience %}
<div class="exp">
<label>Organisation</label>
<input type="text" class="form-control" name="organisation
placeholder="Organisation" value="{% if job.organisation %}
{{job.organisation}}{% endif %}" required>
<label>Job Title</label>
<input type="text" name="job_title" class="form-control" value="{% if job.job_title
%}{{ job.job_title }}{% endif %}" placeholder="Job Title e.g Backend Developer"
required>
<button style="margin-left:15px;" type="button" class="btn btn-danger
remove_job_exp"><strong>Delete Job Experience</strong></button>
</div>
<hr>
{% endfor %}
</div>
<!--BUTTONS-->
<input type="submit"value="Save">
<input type="button" id="add_job_experience"value="Add one">
</form>
</div>
<script>
$(document).on('click', '#add_job_experience',function(e){
e.preventDefault();
$(".job_container").append(`<div class="exp">
<!--IT GOES ON AS ABOVE -->
$(document).on('click', 'button.remove_job_exp', function(e){
e.preventDefault();
$(this).closest('div.exp').remove();
});
You can post multiple inputs with the same name like so:
<input type="text" name="job[]" value="job1"/>
<input type="text" name="org[]" value="org1"/>
<input type="text" name="job[]" value="job2"/>
<input type="text" name="org[]" value="org2"/>
Then in django you can parse the POST data like so:
#require_POST #require POST method or check if request method is POST
def add_jobs(request):
jobs = request.POST.getlist('job[]')
orgs = request.POST.getlist('org[]')
...
Or use Django Formsets: https://docs.djangoproject.com/en/3.2/topics/forms/formsets/
I'm using Django 3.0.2 + Boostrap. I have created a registration/login.html page. The contents of this page are shown below.
The page renders correctly and most of it works OK. However, I am unable to login to my website through this page. I keep getting Your username and password did not match. Please try again. I can login to the admin website without any issues if I use the same username/password. I am not sure what is wrong with my login.html. Any ideas?
{% extends "base.html" %}
{% block content %}
{% if form.errors %}
<p>Your username and password did not match. Please try again.</p>
{% endif %}
{% if next %}
{% if user.is_authenticated %}
<p>Your account does nohave access to this page. To proceed,please login with an account that has access.</p>
{% else %}
<p>Please login to see this page.</p>
{% endif %}
{% endif %}
<div class="container-fluid">
<div class="row justify-content-center">
<div class="col-lg-6">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-4">Welcome Back!</h1>
</div>
<form class="user" method="post" action="{% url 'login' %}">
{% csrf_token %}
<div class="form-group">
<input type="text" class="form-control form-control-user" id="exampleInputUserName" placeholder="Username">
</div>
<div class="form-group">
<input type="password" class="form-control form-control-user" id="exampleInputPassword" placeholder="Password">
</div>
<input type="submit" class="btn btn-primary btn-user btn-block" value="Login">
<input type="hidden" name="next" value="{{ next }}">
</form>
<hr>
<div class="text-center">
<a class="small" href="forgot-password.html">Forgot Password?</a>
</div>
<div class="text-center">
<a class="small" href="register.html">Create an Account!</a>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
Contents of views.py:
from django.contrib.auth import logout
def logout_view(request):
"""Log out user from the website."""
logout(request)
Your input types are missing the name attribute. As per the Mozilla docs:
A string specifying a name for the input control. This name is
submitted along with the control's value when the form data is
submitted.
So the name is submitted with the form. But what if there is no name attribute?
Same Documentation explains:
Consider the name a required attribute (even though it's not). If an
input has no name specified, or name is empty, the input's value is
not submitted with the form.
So your username and password are not sent to the backend.
You need to provide the name attributes to your input types.
<form class="user" method="post" action="{% url 'login' %}">
{% csrf_token %}
<div class="form-group">
<input type="text" class="form-control form-control-user" id="exampleInputUserName" placeholder="Username" `name="username"`>
</div>
<div class="form-group">
<input type="password" class="form-control form-control-user" id="exampleInputPassword" placeholder="Password" name="password">
</div>
<input type="submit" class="btn btn-primary btn-user btn-block" value="Login">
<input type="hidden" name="next" value="{{ next }}">
</form>
It is front-end issue, not particularly related to Django.
i am having a form with only checkboxes:
<div class="container">
<form method="GET" class="form-inline" action="">
<div>
{% for temp in instance.menu_positions_tags.all %}
<label class="checkbox-inline">
<input type="checkbox" name="tags[]" value="{{ temp.name}}">{{ temp.name }}
</label>
{% endfor %}
</div>
<div style="margin-top:10px">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
</div>
When i select few checkboxes and submit the url changes to localhost/test/?tags[]=day4&tags[]=day2. After the page loads the all checkboxes are unselected.
Now, how to, in my form make day4 and day2 checkboxes checked.
If you have checkboxes in your form file you can just render it from the form when you receive the GET request. And I think your form type should be POST.
I am making a website using django but I have a problem with my modelforms. This is my working form code in my html-file:
<form class="form-horizontal" role="form" method="post" action="">
<div class="form-group">
{% csrf_token %}
{{ form.as_p }}
</div>
<input type="submit" value="Inschrijven!" class="btn btn-primary" />
</form>
If i use this code, everything works fine, when I fill in the form and press send, I can see the information from my admin-page.
I now tried to style my form using bootstrap:
<form class="form-horizontal" role="form" method="post" action="">
{% csrf_token %}
{% for field in form %}
<div class="form-group">
<label class="col-sm-4 control-label">{{ field.label }}</label>
<div class="col-sm-4">
<input type="text" class="form-control" placeholder="{{field.label}} ingeven">
</div>
</div>
{% endfor %}
<input type="submit" value="Inschrijven!" class="btn btn-primary">
</form>
Now I have a nice bootstrap layout but if I fill in the form, I can't see the information at my admin-page.
Does somebody know how I can fix this so I can keep the nice layout and still have my form to work?
When you output Django HTML form, you will notice that it creates input elements with the following ID and Name attributes of the element.
Eg
class MyForm...
name = ...
age = ...
HTML
<input type='text' id='id_name' name='name' ...
<input type='text' id='id_age' name='age'...
To fix your issue, in your HTML add the following attribute to the HTML input field you're generating
id="id_{{field.name}}" name="{{field.name}}"
Reasoning:
When the form is submitted, the browser will send form encoded data in the form of name=value pair, which then arrives in form of dict in request.POST and when fed into Django form, it pre fills the form by matching the Django form attribute name to POST values.