django form and title property - django

i need to render my forms with the property "title" for jquery validation, how ill render my forms in this way?
<input name="name" id="name" title="Please fill Your name!" value="" type="text" />
Thanks guys

Simplest way is to set this attribute manually and static like this:
class MyForm(forms.Form):
myfield = forms.CharField(widget=forms.TextInput(attrs={'title':"MYMEGATITLE","id":"MY_ID",'size':'60','maxlength':'70'} ))

Related

how to create same name submit in flask-wtf?

i want to create two same name submit in html like this
<input type="submit" name="key" value="up">
<input type="submit" name="key" value="down">
but i want to use flask-wtf to do it, i don't know how to create Class?is like this?
class NameForm(FlaskForm):
submit = SubmitField('up')
submit = SubmitField('down')
No. Doing it like that will simply overwrite the class attribute submit. Do it like this:
class NameForm(FlaskForm):
key = SubmitField('not_used_string')
Then in your html after return render_template('page.html', form=form) you render it like this:
{{ form.key(value='up', id="A1") }} # -> will render <input id="A1" name="key" type="submit" value="up">
{{ form.key(value='down', id="A2") }} # -> will render <input id="A2" name="key" type="submit" value="down">
You don't have to supply id's but if you don't they will both be key.
Note that in order to have the same name you can only have one class attribute with that name.

Materialize datepicker and Flask-WTForms

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">

Angular JS Form management

I am using Django, and would like to use Angular on my forms. Is there anyway to bind to form elements without having to explicitly write out each input element and add a ng-model?
I would like to be able to do this:
<form name="myForm" ng-submit="submitForm()">
<input type="text" name="username" />
<input type="text" name="password" />
</form>
And access the username/password in $scope as myForm.username and myForm.password, without having to do this:
<form name="myForm" ng-submit="submitForm()">
<input type="text" name="username" ng-model="myForm.username" />
<input type="text" name="password" ng-model="myForm.password" />
</form>
This would be useful when using Django's form builder, which automatically outputs forms based on the model they are based on, and saves having to write out and modify each form when changes are made.
I had to do this yesterday... I would do it like this:
forms.py
form_name = 'myForm' #or some other logic to get form class name
username = forms.CharField(widget=forms.TextInput(attrs={'ng-model': '%s.username' % form_name}))
or use https://github.com/jrief/django-angular
from django import forms
from djangular.forms.angular_model import NgModelFormMixin
class ContactForm(NgModelFormMixin, forms.Form):
subject = forms.CharField()
# more fields ...
This will output:
<input id="id_subject" type="text" name="subject" ng-model="subject" />

Django - Remove the Checkbox in ClearableFileInput widget

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.

HTML simple not blank pattern

I have a simple form and i want the submit button not to work for the conditions i give in the pattern, but if i leave it blank the submit works. how can i make the pattern not to accept it if it is blank?
<form action="test.php" method="POST">
Enter user name:
<input type="text" name="username" pattern="[A-Za-z0-9]{1,20}">
<input type="submit" value="submit">
</form>
I thought the {1,20} is enought but it seems it's not.
HTML has the required attribute to accomplish this. If you set any input to be required, modern browsers won't let you submit the form if those fields are empty.
<input type="text" name="username" required="required" pattern="[A-Za-z0-9]{1,20}">
To prevent errors from showing on load, you can not use the HTML5 required attribute. You can use JavaScript. For example:
if ( $('#form-password').val() === "" )
{
e.preventDefault();
}
Using HTML Patterns to match at least one:
<input type="text" name="username" pattern=".{1,}">