CODEWITHSUNDEEP
phpsymfonytwigsymfony-forms
MehdiB
MehdiB

Reputation: 906

Symfony - second button inline with input field

I have a form with several input fields and a submit button. now I want to add an extra FileType field with an upload button right in front of it. so the user can upload files before submitting the whole form.

I tried to add the button in twig after the input:

<button type='submit'>upload</button>

However the button is pushed to the next line, as symfony/twig(form_row) adds the Filetype field with 3 divs like this:

<div>
    //input field here
</div>

<div>
    //form errors here
</div>

<div class='clear'>    
</div>

The button is added after these 3 divs and on the next line. How can I render this inline with the file upload field?

Upvotes: 4

Views: 3443

Answers (1)

yceruto
yceruto

Reputation: 9575

Symfony gives you a wide variety of ways to customize how a form is rendered. You can customize this form field by using other form/twig funtions like form_label(), form_widget() and form_errors.

<label>{{ form_label(form.file) }}</label>
<div class="inline">
    <button type="submit">Upload</button>
    {{ form_widget(form.file) }} // will render <input type="file" .../> widget
</div>
<div class="errors">
    {{ form_errors(form.file) }}
</div>

If you need to do it for all FileType likely you need to create a type extension and modify the default widget theme of this FileType.

Useful links:

Upvotes: 4

Related Questions