django model form with bootstrap doesn't work - django

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.

Related

how to grab a data from existing field in Django

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>

Sending data in django without creating forms

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.

django: fill checkbox based on url params

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.

Django only submitting csrf token in forms?

So, I have this in my template:
<form action="./validate_code/" method="POST">
{% if error %}
<p>Sorry, that wasn't right.</p>
{% endif %}
<label for="class_code">Your class code: </label>
<input type='text' id='class_code'/>
<input type="color" id="color"/>
{% csrf_token %}
<input type="submit" value="submit">
</form>
Which compiles to:
<form action="./validate_code/" method="POST">
<label for="class_code">Your class code: </label>
<input type='text' id='class_code'/>
<input type="color" id="color"/>
<input type='hidden' name='csrfmiddlewaretoken' value='tGA4jKF1pd1QFC6NSAM9eNFvZqss0r4m' />
<input type="submit" value="submit">
</form>
And when I click submit, firefox sends this parameter:
csrfmiddlewaretoken:"tGA4jKF1pd1QFC6NSAM9eNFvZqs60r4m"
That's it. No text, no color. I have no idea what's going on.
None of your fields have a name attribute, so the browser sends no data.
You should really be using Django's forms framework for this, though.
As mentioned above, you need to specify a "name" attribute in your input fields. You don't need to use Django forms, but if you are submitting the form normally, any fields you are expecting to be sent need to have a name.
<form action="./validate_code/" method="POST">
{% if error %}
<p>Sorry, that wasn't right.</p>
{% endif %}
<label for="class_code">Your class code: </label>
<input type="text" name="class_code" id="class_code">
<input type="color" name="color">
{% csrf_token %}
<button type="submit">Submit</button>
</form>

How to integrate this form with my existing custom template?

I've installed Userena, and I am trying to figure out how to integrate the existing userena form with my own custom HTML form template, I have pasted part of the code for the userena form template, and I do not see ANY css or html, so I'm very confused about how I would integrate this with my own template consisting of HTML, CSS. I figured with Django I'd be able to take any old HTML form and just plugin Django's variables to get it working.
So my question is how can I integrate the top example (userenas form template) into the bottom example (generic HTML example). An example might be helpful.
{% block content %}
<form action="" method="post">
{% csrf_token %}
<fieldset>
<legend>{% trans "Signup" %}</legend>
{{ form.non_field_errors }}
{% for field in form %}
{{ field.errors }}
{% comment %} Displaying checkboxes differently {% endcomment %}
{% if field.name == 'tos' %}
<form action="/register/" method="post" role="form">
<div class="form-group">
<input type="text" class="form-control input-lg" id="nameinput" placeholder="Name" name="contact-name">
</div>
<div class="form-group">
<input type="email" class="form-control input-lg" id="emailinput" placeholder="Email" name="contact-email">
</div>