I want to be able to apply some bootstrap formatting on these fields and labels but I don't want all the fields displayed and I know using widget renders the rest of the fields and labels so what can I use in lieu? I tried
{{ form_start(edit_form, {'attr': {'novalidate': 'novalidate'}}) }}
{{ form_row(edit_form.orgName, {'label_attr': {'class': 'col-md-2'}}, {'label': 'Organization Name'}, {'attr': {'class': 'col-md-4'}}) }}
// blah blah more labels and fields
{{ form_end(edit_form) }}
This generates:
<div class="form-group'">
<div><label class="col-md-2 required" for="company_nameofbundleorg_orgName">Org name</label><input type="text" id="company_nameofbundle_org_orgName" name="company_nameofbundle_org[orgName]" required="required" value="Computation Directorate" /></div>
</div>
Update: I tried this:
{{ form_row(edit_form.orgName, { 'label': 'Organization Name:'
,'label_attr': {'class': 'col-md-2'}
,'attr': {'class': 'col-md-4'}}) }}
I guess putting the "label" before the "label_atrr" matters. But why am I getting my class as "col-md-2 required".
<div class="form-group'">
<div><label class="col-md-2 required" for="company_nameofbundle_org_orgName">Organization Name:</label><input type="text" id="company_nameofbundle_org_orgName" name="company_nameofbundle_org[orgName]" required="required" class="col-md-4" value="Computation Directorate" /></div>
</div>
As you can see it's not applying it to the <div> does not get applied. Any ideas?
This might not be the best solution. I still think modifying the "form_div_layout.html.twig" is probably the best stratgey. A faster solution in my case is to just put
<div class="hidden">
{{ form_widget(edit_form.orgFax) }}
</div>
to not show the one field I do not want to display. If your interested in modifying the "form_div_layout.html.twig" it is located in /vendor/symfony/symfony/src/Symfony/Bridge/Twig/Resources/views/Form/ and here is a good source for modifying it.
Related
So basically I want to have a Updateform() form that allows users to update their account details. All my other forms (register, etc.) work perfectly fine but this specific form never validates on submit. Hence when I press the submit button the page just refreshes but the .validate_on_submit() code doesn't execute.
I've looked through the forums and a common issue I found is the .CSRF token missing, but I'm using form.hidden_tag() which I read should work perfectly fine. So it seems that my issue is unique.
I've been looking on the forums for hours but haven't found a solution.
Here is my form code:
class Updateform(FlaskForm):
email = StringField('Email:', validators=[DataRequired(), Email()])
picture = FileField('Update Profile Picture:', validators=[FileAllowed(['jpg', 'png'])])
submit = SubmitField("Update")
def validate_email(self, email):
if email.data != User.email:
if User.query.filter_by(email=email.data).first():
raise ValidationError('Email has already been registered')
Here is the route:
#users.route('/account', methods=['GET', 'POST'])
#login_required
def account():
form = Updateform()
print("hello")
if form.validate_on_submit():
print(form)
print("YES!!!")
name = current_user.name
pic = add_profile_pic(form.picture.data, name)
current_user.profile_image = pic
current_user.email = form.email.data
db.session.commit()
flash("Account Updated")
# elif request.method == "GET":
# form.email = current_user.email
profile_image = url_for('static', filename='profile_pics/'+current_user.profile_image)
return render_template('account.html', profile_image=profile_image, form=form)
And here is the html code:
{% extends "base.html" %}
{% block content %}
<div align="center">
Hi {{ current_user.name }}<br>
<img align="center" src="{{ url_for('static', filename='profile_pics/'+current_user.profile_image) }}">
</div>
<div class="container">
<form method="post">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.email.label(class='form-group') }}
{{ form.email(class='form-control') }}
</div>
<div class="form-group">
{{ form.picture.label(class='form-group') }}
{{ form.picture(class='form-control') }}
</div>
<div class="form-group">
{{ form.submit() }}
</div>
</form>
</div>
{% endblock %}
The extra classes you see are from the bootstrap library incase anyone is wondering.
Hello you could find out what the problem is by adding a else for you if form.validate_on_submit(): and have it do this
for error in form.email.errors:
print(error)
for error in form.picture.errors:
print(error)
this should tell you what is not working hope this helps and I have not tested this so it could have typos
I am experimenting with Flask and flask-user. The Registration template calls render_field() on a few items, one is email. for example, in my editied copy of registration.html there is:
{% if user_manager.USER_ENABLE_EMAIL %}
{{ render_field(form.email, tabindex=220) }}
{% endif %}
This yields:
<div class="form-group ">
<label for="email" class="control-label">Email</label>
<input class="form-control" id="email" name="email" required="" tabindex="220" type="text" value="">
</div>
How can I add classes to the label tag only?
I've looked at the wtforms code but if there is an answer in there it's not jumping out at me. I see what appears to be the kwargs passed to render_field being added to the input tag but I am not seeing anything touching the label.
I found this. I was looking for render_field in *.py files. I now see that it is defined in the _macros.html file in the flask_user/templates dir.
I am just new to Drupal and trying to update some existing applications. I am trying to associate the title to an URL. I tried this
link(title, content.field_url)
But I don't think I am right track. Any help would be appreciated. Following is the twig templet for displaying persons.
<div class="wdn-col" style="margin-top:2.4em;">
<div class="wdn-grid-set">
<div class="wdn-col-three-sevenths">
<div class="wdn-frame">{{ (content.field_portrait) }}</div>
</div>
<div class="wdn-col-four-sevenths">
<h5 class="wdn-brand clear-top">{{title }}
<span class="wdn-subhead">{{ (content.field_position) }}, {{ (content.field_institution) }}</span></h5>
<p style="font-size:smaller;">{{ (content.field_unit) }}</p>
<p>{{ (content.field_email_address) }}</p>
</div>
</div>
</div>
Try like this way....
{{ title }}
I am playing around with meteor and trying to create a simple quiz application using the same. I have setup my questions collection this way:
{question: "Why did the chicken cross the road??", choices: ["To eat", "To die", "It depends", "There is no chicken"], correctAnswer:2, number : 1},
{question: "Who was the first man to step on moon's surface?", choices: ["Yo Yo Honey Singh", "Neil Armstrong", "Buzz Eldrin", "Rakesh Sharma"], correctAnswer:1, number : 2},
{question: "Where is Timbuktu? ", choices: ["Asia", "There is no such place", "Africa", "Europe"], correctAnswer:2, number : 3},
{question: "Who said 'there is no pill'?", choices: ["Morpheus", "Mr. Anderson", "Neo", "Yoda"], correctAnswer:0, number : 4},
{question: "What is the one thing that saved Arthur Dent's life multiple times?", choices: ["The bugblatter beast of Tral", "Ford Perfect", "A towel", "The babel fish"], correctAnswer:2 , number : 5}
I am able to get the question from the collection but struggling with getting the options for each question (which are stored in an array as shown above). I created two templates, one for the question stem and the second one for the choices. The options template is nested inside the question template like so:
<template name="question">
<p>{{ currentQuestion.question }}</p>
<form>
{{ #each currentQuestion.choices }}
<div class="radio answers">
{{> choices}}
</div>
{{ /each }}
</form>
</p>
</template>
<template name="choices">
<input type="radio" name="answer" id="{{ choice }}"><label for="{{ choice }}">{{ choice }}</label><br>
</template>
Obviously this is not working. Now my questions are:
Is this the best way to setup my collection of question?
How do I setup my nested templates to navigate and display the array of choices in my collection?
Thanks in advance. Looking forward to some solutions for this.
Cheers..
<template name="questions">
{{#each questions}}
{{> question}}
{{/each}}
</template>
<template name="question">
<p>{{ question }}</p>
<form>
{{ #each choices }}
<div class="radio answers">
{{> choices}}
</div>
{{ /each }}
</form>
</template>
<template name="choices">
<input type="radio" name="answer" id="{{ this }}"><label for="{{ this }}">{{ this }}</label><br>
</template>
See working sample in meteorpad
I'm still fairly new to django, and have come across Django forms for the first time through my use of the django.contrib.auth.views.login view, used when Django needs a user to authenticate.
I cannot however figure out how to add a CSS class to the username and password fields and the documentation doesn't specify how I can achieve it. Ideally I'd like to simply add the additional info to the template tag, such as {{ form.username | class="usernameclass" }} or whatever, or even write the field out manually, such as <input type="{{ form.password.type }}" name="{{ form.password.name }}" class="form-field-password"/>, but if I need to add a custom view to achieve this I can try that way.
The files related to this are below:
templates/login.html:
{% load url from future %}
...
<form method="post" action="{% url 'django.contrib.auth.views.login' %}">
{% csrf_token %}
<span class="heading">{{ form.username.label_tag }}</span><br/>
{{ form.username }}<br/>
<span class="heading">{{ form.password.label_tag }}</span><br/>
{{ form.password }}<br/>
<div id="login-button">
<input type="submit" value="Log In" />
<input type="hidden" name="next" value="{{ next }}" />
</div>
</form>
...
settings.py:
...
LOGIN_URL = '/login/'
...
urls.py
...
urlpatterns = patterns('',
url(r'^$', 'portal.views.home', name='home'),
url(r'^login/$', 'django.contrib.auth.views.login', {'template_name': 'login.html'}),
url(r'^logout/$', 'django.contrib.auth.views.logout'),
...
)
Any advice is much appreciated!
This app will do exactly what you need.