I like to change the radio button alignment from vertical to horizontal. I knew i have to add 'form-check-inline' into the existing code <class = "form-check"> for it to happen.
Here are the conditions:
I used bootstrap_4_layout.html.twig as the base theme.
My FormType is :
->add('roles', ChoiceType::class, array(
'choices' => array(
'ADMIN' => 'ROLE_ADMIN',
'TEACHER' => 'ROLE_TEACHER',
),
'expanded' =>true,
'multiple' =>false
))
->get('roles')
->addModelTransformer(new CallbackTransformer(
function ($tagsAsArray) {
// transform the array to a string
return implode(', ', $tagsAsArray);
},
function ($tagsAsString) {
// transform the string back to an array
return explode(', ', $tagsAsString);
}
))
I already looked into form_div_layout.html.twig but I didn't know
which block to choose or how to customize/override it :
{%- block radio_widget -%}
{%- block widget_attributes -%}
{% block attributes -%}
I can arrange it use 'attr' in twig but it create a new <class> instead of overriding it :
{{ form_widget(form.roles, { 'attr': { 'class': 'form-check form-check inline'}}) }}
resulted :
<div id="task_type_transformer_roles" class="form-check form-check-inline">
<div class="form-check">
<input type="radio" id="task_type_transformer_roles_0" name="task_type_transformer[roles]" required="required" class="form-check-input" value="ROLE_ADMIN" />
<label class="form-check-label required" for="task_type_transformer_roles_0">ADMIN</label>
</div>
Thanks in advance.
My entity "corporation" has two ManyToMany relationships with
entity "User" and
entity "Agency"
The related data, I'd like to display as a table with a EntityType-dropdown to (un-)select data.
Therefor I have the following form:
$builder
->add('usercorporations', EntityType::class, array(
'class' => 'UserBundle:User',
'query_builder' => function (EntityRepository $er) use ($corporationMarket) {
return $er->createQueryBuilder('e')
->andWhere(':marketIds MEMBER OF e.markets')
->setParameter('marketIds',$corporationMarket)
->orderBy('e.lastName', 'ASC');
},
'choice_label' => function($user) {
return $user->getFirstName() . ' ' . $user->getLastName() ;
},
'expanded' => false, 'multiple' => true,
'required'=>false,
'by_reference' => false,
'empty_value' => "label.select_user",
'translation_domain' => 'Agency'))
->add('agencies', EntityType::class, array(
'class' => 'AppBundle:Agency',
'query_builder' => function (EntityRepository $er){
return $er->createQueryBuilder('a')
->addOrderBy('a.account', 'ASC');
},
'label' => 'label.agencies',
'choice_label' => function($agency) {
return $agency->getId() . ' - ' . $agency->getAccount() . ' - ' . $agency->getCityName() . ', ' . $agency->getState();
},
'expanded' => false, 'multiple' => true,
'required' => false,
'translation_domain' => 'Agency',
));
my twig template includes the two dropdowns as well as two tables for each of the entities.
{{ form_start(form) }}
{# This renders a red banner if the form contains errors.
If the form variable is not called "form", pass it explicitly. #}
{% include 'Form/form_errors_banner.html.twig' %}
<div class="row">
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body">
<legend>{{ 'label.assignedUsers'|trans }}</legend>
{{ form_widget(form.usercorporations) }}
<br>
<br>
{% include 'UserBundle:User:AssignedUsers.html.twig' %}
</div>
</div>
</div>
<div class="col-md-12">
<div class="panel panel-default">
<div class="panel-body">
<legend>{{ 'label.assignedAgencies'|trans }}</legend>
{{ form_widget(form.agencies) }}
<br>
<br>
{% include 'AppBundle:Agency:AssignedAgencies.html.twig' with {'entity': corporation} %}
</div>
</div>
</div>
<div>
<input type="submit" class="btn-primary btn" value="{{ 'label.apply'|trans }}"/>
</div>
{{ form_end(form) }}
</div>
I'm using the tables (AssignedUsers and AssignedAgencies) on other pages too, that's all working fine.
So now my problem:
I'd like to have the possibility to simply add and remove users or agencies. By just deselecting e.g. a user from the dropdown and then submitting, it's working, the user isn't assigned to the corporation anymore. Somehow, the same procedure is not working for the agencies. I don't know why though, I dumped the data prior to and after the flush and it's dumping the correct data, but when I return to the corporation, nothing changed.
My controller action:
/**
* #Route("/corporation/{id}/{page}", name="appBundle_corporation", requirements={"id" = "\d+", "page" = "\d+"}, defaults={"page" = 1}))
*/
public function corporationAction($id, Request $request, $page)
{
$repository = $this->getDoctrine()
->getRepository('AppBundle:Corporation');
$em = $this->getDoctrine ()->getManager ();
$corporation = $repository->findOneById($id);
/*
* CREATE PAGINATION FOR TABLES
*/
//assigned Users
$assignedUsers = $corporation->getUsercorporations();
$assignedAgencies = $corporation->getAgencies();
dump($assignedAgencies);
$form = $this->createForm(CorporationAssignmentType::class,$corporation, array(
'corporationMarket' => $corporationMarket,
));
$form->handleRequest($request);
if ($form->isSubmitted() && $form->isValid()) {
$em->persist($corporation);
$em->flush();
dump($assignedAgencies);
$this->addFlash(
'success',
'Your changes were saved!'
);
return $this->redirectToRoute('appBundle_corporation', array('id' => $corporation->getId()));
}
return $this->render('AppBundle::corporation.html.twig', array(
'item' => $corporation,
'corporation'=>$corporation,
'assignedUsers'=>$userTable,
'assignedAgencies' => $agencyTable,
'form' => $form->createView(),
));
}
any ideas why it's flushing the users but not the agencies?
I solved my problem that way, but it might be that #ASOlivieri 's answer could've helped es well.
What I did initially is:
in Entity Agency
/**
* #ORM\ManyToMany(targetEntity="AppBundle\Entity\Corporation", inversedBy="agencies", cascade={"persist"})
* #ORM\JoinTable(name="app_agency_corporations",
* joinColumns={#ORM\JoinColumn(name="agency_id", referencedColumnName="iata8")},
* inverseJoinColumns={#ORM\JoinColumn(name="corporation_id", referencedColumnName="ucid")})
* #var \AppBundle\Entity\Corporation
**/
private $corporations;
in Entity Corporation
/**
* #ORM\ManyToMany(targetEntity="AppBundle\Entity\Agency", mappedBy="corporations")
**/
private $agencies;
when switching it --> the shorter code to the Agency's property corporations and the longer code about the JoinTable etc. to the Corporation's property agencies it worked.
If anybody could explain to me why this is the solution, I'd be happy!
If your entities work in other places (other controllers, etc.) then I suspect you have to by_reference to false in your agencies form options.
->add('agencies', EntityType::class, array(
'class' => 'AppBundle:Agency',
'query_builder' => function (EntityRepository $er){
return $er->createQueryBuilder('a')
->addOrderBy('a.account', 'ASC');
},
'label' => 'label.agencies',
'choice_label' => function($agency) {
return $agency->getId() . ' - ' . $agency->getAccount() . ' - ' . $agency->getCityName() . ', ' . $agency->getState();
},
'expanded' => false, 'multiple' => true,
'required' => false,
'by_reference' => false,
'translation_domain' => 'Agency',
));
It looks as though it's set that way in your user form options.
At first, my objective here is to make two input fields inline, the picture is attached :
Symfony allow us to style form's field by using attr for form_widget of the field and label_attr for form_label but here i want to apply a style for the div containing the label + input that Symfony generate automatically in the twig :
$builder
->add('language', ChoiceType::class, array(
'choices' => array(
'FR' => 5,
'EN' => 1,
),
'label' => ' ',
'attr' => array('style' => 'float:left;width:40%'),
))
->add('level', ChoiceType::class, array(
'choices' => array(
'Good' => 5,
'Bad' => 1,
),
'label' => ' ',
'attr' => array('style' => 'float:left;width:40%'),
));
result : The style has been applyed to the input (select in our case) and the div parent wasn't be affected (stay with empty style):
<div id="homebundle_personnel_personnelLanguages_0">
<div> <!-- the div that i want to apply a style -->
<label for="homebundle_personnel_personnelLanguages_0_language" class="required"> </label>
<select id="homebundle_personnel_personnelLanguages_0_language" name="homebundle_personnel[personnelLanguages][0][language]" style="float:left;width:40%">
<option value="5">FR</option>
<option value="1">EN</option>
</select>
</div>
<div>
<label for="homebundle_personnel_personnelLanguages_0_level" class="required"> </label>
<select id="homebundle_personnel_personnelLanguages_0_level" name="homebundle_personnel[personnelLanguages][0][level]" style="float:left;width:40%">
<option value="5">Good</option>
<option value="1">Bad</option>
</select>
</div>
</div>
Resolved, I must treat this in the twig's level :
<div style="float:left;width:40%" >
{{ form_widget(form.language) }}
</div>
<div style="float:left;width:40%" >
{{ form_widget(form.level) }}
</div>
use:
'row_attr' => [
'class' => 'yourClass',
],
This question already has answers here:
Symfony - Add class to form tag
(2 answers)
Closed 5 years ago.
I'm looking to add some class attribute in my form using symfony form builder.
I have found how to do this for input and label, but not for the form tag.
$builder->add('label', TextType::class,
[
'attr' => ['class' => 'a'], // for input
'label_attr' => ['class' => 'b'], // for label
]
);
But the render is the following:
<form method="POST">
<label for="label" class="b">Label</label>
<input type="text" class="a" name="label">
<button type="submit">Create</button>
</form>
And i just want
<form method="POST" class="c">
I tried the following:
$builder->->setAttribute('class', 'c');
But it didn't change anything
Either you do it in your builder, controller or your view.
Controller :
$form = $this->createForm(new FormType(), $data, array('attr' => array('class' => 'class')));
View (Twig) :
{{ form_start(form, { 'attr' : { 'class': 'class' } })
As Joe pointed out source here
This question already has an answer here:
globally change ZF2 form formatting
(1 answer)
Closed 7 years ago.
I am creating a form using Zend Framework 2 and the Skeleton Application.
I want my layout to replicate the default example:
As you can see above, the form inputs stretch to the width of the screen. The code to produce this is (using just the email address field as an example):
<div class="form-group">
<label for="exampleInputEmail1">Email address</label>
<input type="email" placeholder="Email" id="exampleInputEmail1" class="form-control">
</div>
I would like the same result to happen when I add my own form element using Zend Framework 2 (Skeleton application). But when I add an element:
$this->add(array(
'name' => 'campaign_code',
'type' => 'Text',
'options' => array(
'label' => 'Campaign Code',
),
'attributes' => array(
'class' => 'form-control',
)
));
The resulting HTML is:
<div class="form-group">
<label>
<span>Campaign Code</span>
<input class="form-control" type="text" name="campaign_code">
</label>
</div>
Resulting in:
Notice how the label tag is surrounding the span and input elements? I don't want that. I want the label tag to close itself as in the first html example.
The form view helpers are so smart while rendering the elements from your form.
Add an id attribute with respective element
$this->add(array(
'name' => 'campaign_code',
'type' => 'Text',
'options' => array(
'label' => 'Campaign Code',
),
'attributes' => array(
'class' => 'form-control',
'id' => 'your_id',
)
));