I am using the datepicker from materialize css and have linked it to flask-wtforms.
It works amazingly but I can't get the green validation state on my input when I select a date, it always adds an invalid class as shown, and I can't seem to understand why:
The code I am using is below:
form.py
from flask_wtf import Form, FlaskForm
from wtforms import validators, DateField
# from wtforms.fields.html5 import DateField
class ApplicationForm(FlaskForm):
date_of_birth = DateField('Date of Birth', [validators.Required()], format='%d/%m/%Y')
I am using a macro so the html is rendered:
<div class="input-field col s6">
<input class="validate datepicker" id="date_of_birth" name="date_of_birth" type="text" value="">
<label for="date_of_birth">Date of Birth</label>
</div>
The form passes validation when I submit it. I have also tried the html5 DateField but that doesn't seem to work either.
Does anyone know what I am doing wrong?
You don't need class of validate for datepicker.
Change this to
<input class="validate datepicker" id="date_of_birth" name="date_of_birth" type="text" value="">
to
<input class="datepicker" id="date_of_birth" name="date_of_birth" type="text">
Related
I am wanting to create a bootstrap themed togglebox with crispy forms, but the toggle box displays with a checkbox inside it.
In order to find out why I opened the page in Chrome and using inspect, deleted the class from the label tag (custom-control-label below) which removed the inner checkbox leaving just the bootstrap togglebox as I wanted.
So my question is how can I remove a class from a cripsy forms field?
forms.py
completed = forms.BooleanField(label='Have you completed it?', required=False, widget=forms.CheckboxInput(attrs={}))
generated html:
<div class="form-group">
<div id="div_id_completed" class="custom-control custom-checkbox">
<input type="checkbox" name="completed" class="checkboxinput custom-control-input"
id="id_completed" checked="">
<label for="id_completed" class="custom-control-label">
Have you completed it
</label>
</div>
</div>
Thank you.
I'm finding it overly difficult to customize ClearableFileInput as set as the default widget in a modelForm that includes an ImageField in the model.
Particularly I don't want the Delete Checkbox that is part of the widget. I've tried customizing/overriding the rendering in a number of ways to get rid of the checkbox including setting the widget to FileInput and overriding the render method where subclassing the widget in a widgets.py file.
The simplest I can explain the problem is like this:
forms.py
class SpecImageForm(ModelForm):
orig_image = forms.ImageField(required=False, widget=forms.FileInput)
class Meta:
model = SpecImage
fields = ['orig_image',]
# The intention is to have more than one SpecImageForm once this is working but for now the
# max_num is set to 1
SpecImageFormSet = inlineformset_factory(Spec, SpecImage, form=SpecImageForm, extra=1, max_num=1)
Despite explicitly setting the FileInput against the widget it renders like this in my template - still including the checkbox which I don't think should be present using FileInput.
<fieldset>
<legend>Images</legend>
<input id="id_specimage_set-TOTAL_FORMS" name="specimage_set-TOTAL_FORMS" type="hidden" value="1" />
<input id="id_specimage_set-INITIAL_FORMS" name="specimage_set-INITIAL_FORMS" type="hidden" value="0" />
<input id="id_specimage_set-MAX_NUM_FORMS" name="specimage_set-MAX_NUM_FORMS" type="hidden" value="1" />
<ul>
<li>
<label for="id_specimage_set-0-orig_image">Orig image:</label>
<input id="id_specimage_set-0-orig_image" name="specimage_set-0-orig_image" type="file" />
</li>
<li>
<label for="id_specimage_set-0-DELETE">Delete:</label>
<input id="id_specimage_set-0-DELETE" name="specimage_set-0-DELETE" type="checkbox" />
<input id="id_specimage_set-0-id" name="specimage_set-0-id" type="hidden" />
<input id="id_specimage_set-0-car" name="specimage_set-0-car" type="hidden" />
</li>
</ul>
</fieldset>
The relevant part of the template is this:
<fieldset>
<legend>Images</legend>
{{ image_form.management_form }}
{% for form in image_form %}
<ul>
{{ form.as_ul }}
</ul>
{% endfor %}
</fieldset>
The only thing slightly different that I'm doing is using an inlineformset_factory.
I've also tried to override the rendering of a widget using widgets.py but similarly seem unable to rid myself of the defualt settings - principally based on this thread.
Any ideas or solution to rid myself of the checkbox would be gratefully received!
I think this is to do with the inlineformset_factory applying a default can_delete parameter set to true, which was present regardless of how I'd prepared the form to use with it. Simply passing can_delete=False got rid of the Delete checkbox.
SpecImageFormSet = inlineformset_factory(Spec, SpecImage, form=SpecImageForm, extra=1, max_num=1, can_delete=False)
In addition when I rendered the form on it's own (without using inlineformset_factory) there was no sign of a 'Delete checkbox'. Then I found this SO post that explained why.
Getting there.
I am using crispy_forms and FormHelper. I have a model field declared as:
active = models.BooleanField(default=True)
And in my ModelForm, I have tried both the following in my Layout:
self.helper.layout = Layout(
...
InlineCheckboxes('active'),
Field('active'),
...
which both not providing the desired result:
Please see image link
While using InlineCheckboxes, I do not see the checkbox and using only Field, it's not formatted correctly.
Please help
Here is the link to the "Bootstrap Layout objects" section of Crispy Forms docs.
InlineCheckboxes: It renders a Django forms.MultipleChoiceField field using inline checkboxes
InlineCheckboxes isn't appropriate for your model's field-type.
A hacky way to achieve what you're looking for is to use PrependedText with an empty string for the text argument.
...
PrependedText('active', ''),
...
Examining the source it appears that a boolean field by default renders the <input> tag inside the <label> tag. Using the hack above, 'Active' stays in the <label> and the <input> is put where you'd expect: in a <div> with "control" css class. Compare the following:
PrependedText('active', ''):
<div id="div_id_active" class="form-group">
<label for="id_active" class="control-label">Active</label>
<div class="controls">
<div class="input-group">
<input type="checkbox" name="active" class="checkboxinput" id="id_active" />
</div>
</div>
</div>
Field('active'):
<div class="form-group">
<div id="div_id_active" class="checkbox">
<div class="controls">
<label for="id_active" class=""><input type="checkbox" name="active" class=
"checkboxinput checkbox" id="id_active" /> Active</label>
</div>
</div>
</div>
Update
I've confirmed that this is fixed in the dev branch of django-crispy-forms.
Reference this commit: 5c3a268
And this github issue: #267
django form
{% for field in form.fields %}
{{field}}
</div>
{% endfor %}
If there is an error {{field.email}} will output this html with a post data value
<input id="id_email" type="text" value="gffdg" />
I want to use HTML 5 inputs but don't know how to get the post value if there is error
<input id="id_email" type="email" >
edit..
I was hoping not to use widgets with my django forms and just type the html5 code in my template (type="email" not type="text")
<input id="id_email" type="email" >`
but can't figure out how to get the value back after a post with errors.
<input value="?????" />
If you are trying to get the bound value of the email field, then the following template code should work:
<input id="id_email" type="email" value="{{ form.email.value }}">
If the value is not set, then it will be a blank field.
This is standard checkbox from model forms:
In my HTML I have: {{form}}
In website source:
<div class="id_accept-control-group control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox" name="accept" id="id_accept" /> <span>Accept</span>
</label>
</div>
</div>
How to add custom attribute: disabled="disabled" checked="checked" (to input)?
Check out this question to point you in the right direction Django: How do I add arbitrary html attributes to input fields on a form?
Also take a look at the model forms django doc https://docs.djangoproject.com/en/dev/topics/forms/modelforms/