How to access the each form item
$builder->add('icon', 'entity', array(
'class' => 'UserBundle:IconPics',
'property' => ‘label', 'expanded' => true, 'multiple' => false,
));
in twig
{{ form_label(form.icon) }}
{{ form_widget(form.icon) }}
it show this codes automatically and works well as radio button selector.
<div id="fos_user_registration_form_icon">
<input type="radio" id="fos_user_registration_form_icon_1" name="fos_user_registration_form[icon]" required="required" value="1" />
<label for="fos_user_registration_form_icon_1" class="required">pictureA.jpg</label>
<input type="radio" id="fos_user_registration_form_icon_2" name="fos_user_registration_form[icon]" required="required" value="2" />
<label for="fos_user_registration_form_icon_2" class="required">pictureB.jpg</label></div>
But I want to access each items in this code manually.
Since,I want to change code like this.
pictureB.jpg --> <img src="pictureB.jpg">
pictureA.jpg --> <img src="pictureA.jpg">
Is it possible??
If you want to customise the way any form widget is rendered, you've then to override it. Take a deeper look at How to customize Form Rendering section of the documentation.
You can find here the default behaviour of all the form fields widget blocks. As described in the documentation, you've to,
First, know which block to override.
Then, Override the block using form theming (the documentation
is full of examples whether you need to override your widget only
when a given template is concerned or globally on your application)
Related
I encounter a problem related to the use of the EntityType with the extended and multiple set to true (which generates checkboxes) and then validating each field separately (required or not) using the JqueryValidate plugin.
I'm using the automatic rules set by the class and attributes, so all fields work well but the checkboxes.
This happens because the validator uses the attribute name to set validation rules, but each validation rule is only applied once per name, so only the first checkbox is validated. This combined with the impossibility to change the names for the choices of an EntityType with extended and multiple, makes it impossible to use this configurations together.
CODE
FormType
$builder
->add('checkboxes', EntityType::class, [
'class' => MyClass::class,
'required' => false,
'expanded' => true,
'multiple' => true,
]);
Checkboxes rendered
<input type="checkbox" id="appbundle_myclass_checkboxes_1" name="appbundle_myclass[checkboxes][]" value="1">
<input type="checkbox" id="appbundle_myclass_checkboxes_2" name="appbundle_myclass[checkboxes][]" value="2" required="">
QUESTION
Is there a way to change the name attribute of those checkboxes so I can do multiple validations on them?
Or is there a workaround to make the validator work in these cases?
In symfony 3 the forms were rendered with the classes "control-label" for the label element and "form-control" for the input element, and both wrapped in a div with the class "form-group" like this:
<div class="form-group">
<label class="control-label" for="hazardlogbundle_acrgroup_serial">Serial</label>
<input type="number" id="hazardlogbundle_acrgroup_serial" name="hazardlogbundle_acrgroup[serial]" class="form-control">
</div>
In symfony4 however, all three of these classes have been omitted, the same form now looks like this:
<div>
<label for="hazardlogbundle_acrgroup_name" class="required control-label">Grupp (ATS) namn</label>
<input type="text" id="hazardlogbundle_acrgroup_name" name="hazardlogbundle_acrgroup[name]" required="required" class="form-control">
</div>
I happened to use these three classes (or actually, bootstrap did) for my css styling 😇 Is there an easy way of getting these back?
To get the form-control on the actual input I can use:
$builder->add('name', TextType::class, array('label' => 'Grupp (ATS) namn', 'attr' => array('class' => 'form-control')));
But that doesn't solve the problem for the wrapping div or the label itself... I understand I can go and create custom twig templates for each and every form, but no thank you 😎
You can assign "themes" to the Symfony Forms. There are already themes from Symfony for Bootstrap 3,4 and 5. For that you need to specify the theme in the config file of twig. (config/packages/twig.yaml)
For bootstrap 3:
twig:
form_themes: ['bootstrap_3_layout.html.twig']
For bootstrap 4:
twig:
form_themes: ['bootstrap_4_layout.html.twig']
In Symfony 4 there seems to be no predefined theme for bootstrap 5 yet.
You can read more here: https://symfony.com/doc/4.3/form/form_themes.html
I have added the following form typo in Symfony to my form. As it is not a member of the entity I need to handle it manually in the controller. How can i get the checkbox value in my controller?
->add('showUrl', 'checkbox', array(
'mapped' => false,
))
This is the generated html in the form:
<input type="checkbox" id="cuslocation_accountreg_showUrl" name="cuslocation[accountreg][showUrl]" required="required" value="1">
$form->getData()['showUrl']
or
$form->get('showUrl')->getData()
or
$form['showUrl']->getData()
I currently have a radio button list with an "Other" option.
#Html.RadioButtonFor(model => model.Language, "English") English
#Html.RadioButtonFor(model => model.Language, "Spanish") Spanish
#Html.RadioButtonFor(model => model.Language, "Other") Other:
#Html.TextBoxFor(model => model.OtherLanguage)
However, this setup requires an additional field in the model. If the user clicks "Other" and types in "French", for example, the model will contain:
Language: Other
OtherLanguage: French
I would like a cleaner approach where the model just contains Language: French. What is the easiest way to do this?
Using Jquery
#Html.TextBoxFor(m => m.Language) // assume this renders id="Language"
Then create your radio buttons (not using HtmlHelpers)
<input type="radio" name="language" value="English" /> // plus label
<input type="radio" name="language" value="Spanish" /> // plus label
....
In script
$('input[type="radio"]').change(function () { // or input[name="language"]
$('#Language').val($(this).val());
}
I have a problem with overlapping forms in Symfony 2. I'm trying to create an application with photos albums.
To do so, I need to create an album and adding him photos during this process.
Photos are link with onl one album.
I think that my code is right on backend but the photo's form never shown inside the album's form. I think the problem is in the form himself.
A photo have to attribute: a file and a name.
This is my form.
<script type="text/javascript">
$(document).ready(function() {
var $container = $('#thelink_albumbundle_albumtype_photos');
function add_photo() {
index = $container.children().length;
$container.append(
$($container.attr('data-prototype').replace(/\$\$picture\$\$/g, index))
);
}
if($container.children().length == 0)
add_tag();
$('#add_photo').click(function() {
add_photo();
});
});
<form method="post" enctype="multipart/form-data">
{{ form_widget(form) }}
<div id="thelink_albumbundle_albumtype_photos" data-prototype="<div>
<label class=" required">$$photo$$</label>
<div id="thelink_albumbundle_albumtype_photos$$photo$$">
<div><label for="thelink_albumbundle_albumtype_photos$$photo$$_photo"
class=" required">Photo</label>
<input type="file" id="thelink_albumbundle_albumtype_photos$$photo$$_photo"
name="thelink_albumbundle_albumtype[photos][$$photo$$][picture]" required="required"
maxlength="255" value="" /></div></div></div>">
</div>
<br />
<a href="{{ path('TheLinkAlbumBundle_index') }}" title="Retourner sur la liste des Albums">
Annuler la {% if news is defined %}Modification{% else %}Création{% endif %}
</a>
<input type="submit" value="{% if album is defined %}Modifier{% else %}Créer{% endif %} l'Album" />
Do you have any idea ? Or the problem is else where ?
It looks like you're manually entering the data prototype? Assuming "photos" is a collection type. Make sure you have the "allow_add", "allow_delete", and "prototype" options set to true:
->add('photos', 'collection', array(
'type' => new PhotoType(),
'allow_add' => true,
'allow_delete' => true,
'prototype' => true
))
Then you can just do {{ form_row(form.photos) }} and it should render the prototype automatically.
It would help more if you could post your form type as well.