I want to add Login Section to the registration page.. Basically, the idea is, when the user goes to the registration page, the login section will be also available on the same page, in-case the user realizes that he already has an account. I am trying this but its not working...
//Registration_content.html.twig
<form action="{{ path('fos_user_registration_register') }}" {{ form_enctype(form) }} method="POST" class="fos_user_registration_register">
{{ form_errors(form.email.first) }}
{{ form_errors(form.plainPassword.first) }}
{{ form_widget(form.email.first)}}
{{ form_widget(form.email.second)}}
<br />
{{ form_widget(form.plainPassword.first) }}
{{ form_widget(form.plainPassword.second) }}
<br />
{{ form_widget(form.country) }}
<br />
{% for choiceFormView in form.Position %}
{{ form_widget(choiceFormView) }} {{ form_label(choiceFormView) }}<br />
{% endfor %}
{% for choiceFormView in form.notification %}
{{ form_widget(choiceFormView) }} {{ form_label(choiceFormView) }}<br />
{% endfor %}
{{ form_rest(form) }}
<div>
<input type="submit" value="{{ 'registration.submit'|trans({}, 'FOSUserBundle') }}" />
</div>
</form>
What i want to add to this page is, the login page contents. But of course it is not working;
{% block fos_user_content %}
{% if error %}
<div>{{ error|trans({}, 'FOSUserBundle') }}</div>
{% endif %}
<form action="{{ path("fos_user_security_check") }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
<label for="username">{{ 'security.login.username'|trans({}, 'FOSUserBundle') }}</label>
<input type="text" id="username" name="_username" value="{{ last_username }}" required="required" />
<br>
<br>
<label for="password">{{ 'security.login.password'|trans({}, 'FOSUserBundle') }}</label>
<input type="password" id="password" name="_password" required="required" />
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
<label for="remember_me">{{ 'security.login.remember_me'|trans({}, 'FOSUserBundle') }}</label>
<input type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans({}, 'FOSUserBundle') }}" />
</form>
What is the right way to approach this... I will have the login section on many pages as well. So the real question seems to be, how do I use fosuser login section on the other pages?
Just put
{% render "FOSUserBundle:Security:login" %}
in any template of your page where you want the login form to be rendered.
Related
I had some problems using php bin/console fos:user: create in my project so I had copied the vendor of another project that is working well and then I created a file User.php but at the display of the login . I receive this while in the other project it replaces the other attributes security.login.username by username and security.login.password by password ,etc
{% trans_default_domain 'FOSUserBundle' %}
{% if error %}
<div>{{ error.messageKey|trans(error.messageData, 'security') }}</div>
{% endif %}
<form action="{{ path("fos_user_security_check") }}" method="post">
{% if csrf_token %}
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
{% endif %}
<label for="username">{{ 'security.login.username'|trans }}</label>
<input type="text" id="username" name="_username" value="{{ last_username }}" required="required" autocomplete="username" />
<label for="password">{{ 'security.login.password'|trans }}</label>
<input type="password" id="password" name="_password" required="required" autocomplete="current-password" />
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
<label for="remember_me">{{ 'security.login.remember_me'|trans }}</label>
<input type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans }}" />
</form>
You need to set your translator to ~ in your app/config/config.yml file.
# app/config/config.yml
framework:
translator: ~
Hi I'm trying to include the login form of the FOSUser Bundle in my custom template. Like that:
{% include 'FOSUserBundle:Security:login.html.twig' %}
But I have this error:
Variable "error" does not exist in FOSUserBundle:Security:login.html.twig at line 7
Is there a way to include the template without adding something in my controller?
To overriding FosUserBundle's template you have to do this :
Create a folder FOSUserBundle/view in app/Resources
Copy the view folder of FOSUserBundle in your folder you have create just before
And you can include your template and custom FOSUser view.
Example :
layout.html.twig of FOSUser in app/Resources/FOSUserBundle/view:
{% extends ":layout:Public/layout.html.twig" %} #My layout
{% block body %}
<div>
{% block fos_user_content %}
{% endblock fos_user_content %}
</div>
{% endblock %}
And app/Resources/FOSUserBundle/view/Security/login.html.twg :
{% extends "FOSUserBundle::layout.html.twig" %}
{% trans_default_domain 'FOSUserBundle' %}
{% block fos_user_content %}
<div class="col-md-4">
<form action="{{ path("fos_user_security_check") }}" method="post">
<h2 class="form-signin-heading">Se connecter </h2>
<hr>
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
<label class="sr-only" for="username">{{ 'security.login.username'|trans }}</label>
<input class="form-control" type="text" id="username" name="_username" value="{{ last_username }}" required="required" />
<label class="sr-only" for="password">{{ 'security.login.password'|trans }}</label>
<input class="form-control" type="password" id="password" name="_password" required="required" placeholder="Mot de passe" />
<div class="checkbox">
<label>
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
<label for="remember_me">{{ 'security.login.remember_me'|trans }}</label>
</label>
</div>
<input class="btn btn-primary" type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans }}" />
</form>
<br>
Mot de passe perdu ?
</div>
<div class="col-md-2"></div>
<div class="col-md-3">
<h2>Pas encore inscrit ?</h2>
<hr>
<em>
nous vous invitons à vous inscrire<br />
</em>
<br /><br />
S'inscrire
</div>
{% endblock fos_user_content %}
I think there is many solutions, but according to me it's the better way to overrinding fosuser's views
This template is expected to be rendered as a full page. To include it, it might be more convenient to render the controller action.
{{ render(controller('FOSUserBundle:Security:login')) }}
I am using Sonata Admin with SonataUser/FosUser bundles.
I want to integrate the "reset password" functionality from FosUser into Sonata. Is there a quick way to :
integrate the "forgot your password" link into the sonata login page ?
integrate the functionality with the "admin/" url prefix and the sonata html/twig layout ?
I have modified the admin login template to add the reset password link, you must extend the SonataUserBundle in order to use your custom template, follow the documentation.
The custom template must have the same name and the same directory as in SonataUserBundle. Here is the template I used :
Application\Sonata\UserBundle\Resources\views\Admin\Security\login.html.twig
{% extends base_template %}
{% block content %}
<div class="connection">
<form action="{{ path("sonata_user_admin_security_check") }}" method="post">
{% if error %}
<div class="alert alert-error">{{ error|trans({}, 'SonataUserBundle') }}</div>
{% endif %}
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
<div class="control-group">
<label for="username">{{ 'security.login.username'|trans({}, 'FOSUserBundle') }}</label>
<div class="controls">
<input type="text" id="username" name="_username" value="{{ last_username }}" class="big sonata-medium"/>
</div>
</div>
<div class="control-group">
<label for="password">{{ 'security.login.password'|trans({}, 'FOSUserBundle') }}</label>
<div class="controls">
<input type="password" id="password" name="_password" class="big sonata-medium" />
</div>
</div>
<div class="control-group">
<label for="remember_me">
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
{{ 'security.login.remember_me'|trans({}, 'FOSUserBundle') }}
</label>
</div>
<div class="control-group">
<a href="{{ path('fos_user_resetting_request') }}">
{{ 'forgotten_password'|trans({}, 'SonataUserBundle') }}
</a>
</div>
<div class="form-actions">
<input type="submit" class="btn btn-primary" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans({}, 'FOSUserBundle') }}" />
</div>
</form>
</div>
{% endblock content %}
I am styling my django app but Iam having trouble styling the forms. I have a contact form, in my forms.py and then I have use it in a template.
<form class="form-contact" action="" method="POST">
{% csrf_token %}
<input type="text" name="Name" id="id_name" value="{{form.name}}" />
<input type="submit" value="Submit" class="btn btn-primary">
</form>
That isn't working. I have also tried this, but still no luck, it shows styled fields but doesn't retrieve the information ( I get a message under my {{form.errors}} .
<form class="form-contact" action="" method="POST">
{% csrf_token %}
{% for field in form %}
<fieldset class="form-group">
<label class="control-label" for="id_{{ field.name }}">{{ field.label }}</label>
<div class="form-control">
<input type="text" class="form-control"
name="{{ field.label }}"
id="{{ field.name }}"
value="{{ field.name }}" >
{{ field }}
<p class="help-text">{{ field.help_text }} </p>
</div>
</fieldset>
{% endfor %}
<input type="submit" value="Submit" class="btn btn-primary">
</form>
Any hint would be apreciated.
Regards.
EDIT:
This second code, is actually showing 2 input fields for each form field. If I fill the second one, the form works but, this second input has no styling...
"EDIT: This second code, is actually showing 2 input fields for each
form field."
The first input is being generated by the <input> tag that you've explicitly written:
<input type="text" class="form-control"
name="{{ field.label }}"
id="{{ field.name }}"
value="{{ field.name }}" >
The second input is being generated by the {{ field }} variable:
<div class="form-control">
<input type="text" class="form-control"
name="{{ field.label }}"
id="{{ field.name }}"
value="{{ field.name }}" >
{{ field }} <-- this one
<p class="help-text">{{ field.help_text }} </p>
</div>
"If I fill the second one, the form works but, this second
input has no styling..."
The styling isn't working because when the {{ field }} input is rendered, there's no css classes on it.
Additionally, you've switched some of the attributes of each field object (see "What changed" section below for more).
Try this code:
<form class="form-contact" action="" method="POST">
{% csrf_token %}
{% for field in form %}
<fieldset class="form-group">
<label class="control-label" for="id_{{ field.name }}">{{ field.label }}</label>
<div class="form-control">
<input type="text" class="form-control"
name="{{ field.name }}"
id="id_{{ field.name }}"
value="{{ field.value }}" >
<p class="help-text">{{ field.help_text }} </p>
</div>
</fieldset>
{% endfor %}
<input type="submit" value="Submit" class="btn btn-primary">
</form>
For more on how this works, check out the "Looping over a form's fields" section of the docs. You might also be interested in "Django Bootstrap Form", a third-party-package that allows for quick and easy form styling.
What changed:
1. Removed the {{ field }} variable within the loop
2. {{ field.label }} replaced with {{ field.name }} within the name attribute
3. {{ field.name }} replaced with {{ field.value }} within the value attribute
Wrap the form in div's with container, row, and col. Also, add the input type.
<style>
.help-text {
font-style: italic;
font-variant: all-small-caps;
}
</style>
<div class="container">
<form class="my-form" action="." method="POST">
{% csrf_token %}
{% for field in form %}
<div class="form-group row">
<label class="col-12 col-form-label" for="id_{{ field.name }}">{{ field.label }}</label>
<div class="col-12">
<input
type="{{ field.field.widget.input_type }}"
class="form-control"
name="{{ field.name }}"
id="id_{{ field.name }}"
value="{{ field.value|default:'' }}"
>
</div>
<div class="col-12 help-text">{{ field.help_text }} </div>
</div>
{% endfor %}
<div class="row">
<div class="col-12">
<input type="submit" value="Submit" class="btn btn-primary">
</div>
</div>
</form>
</div>
Alternatively you can use, forms.py file for creating forms.
And install django-bootstrap and work.. It will be very interesting.
I just don't want to show the login form of the layout in the main login page..
I tried to set a variable in the login child template ({% set layout_login = false %}) and checking its value in the layout, but i needed to set also the variable in the layout ({% set layout_login = true %}), and it always catches the value of the variable set in the layout (true)....
And tried also setting a variable in the controller, but there isn't anything like isset() in twig...
Any idea?
Why don't you just define a block in your main layout?
{% block loginForm %}
<form />
{% endblock %}
And overload it in your login template:
{% block loginForm %}{% endblock %}
The equivalent to isset() is defined.
I wrote st like this:
{% if layout_login is not defined %}
{% if error %}
<div>{{ error|trans({}, 'FOSUserBundle') }}</div>
{% endif %}
<form action="{{ path("fos_user_security_check") }}" method="post">
<input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
<label for="username">{{ 'security.login.username'|trans({}, 'FOSUserBundle') }}</label>
<input type="text" id="username" name="_username" value="{{ last_username }}" />
<label for="password">{{ 'security.login.password'|trans({}, 'FOSUserBundle') }}</label>
<input type="password" id="password" name="_password" />
<input type="checkbox" id="remember_me" name="_remember_me" value="on" />
<label for="remember_me">{{ 'security.login.remember_me'|trans({}, 'FOSUserBundle') }}</label>
<input type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans({}, 'FOSUserBundle') }}" />
</form>
{% endif %}