轻松管理包模式对话框自定义操作？

Question

I'm working with Easy Admin Bundle for Symfony2. How can I use my own modal dialog with text input for the custom action in the list?

Let's say custom action is called rename and after hitting button Rename in the list I wanna in modal dialog write a new name of something. Then after hitting button OK I wanna call ranameAction in the controller which will do everything needed, but parameter called name must be sent there.

I have the solution but it is not good, there must be some better way.

I created _simple_form.html.twig:

{{
    form(rename_form, {
        action: rename_form.vars.action ~ '&referer=' ~ referer,
        method: 'POST',
        attr: { id: 'rename-form', style: 'display: none' }
    })
}}

<div id="modal-rename" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <h4>{{ 'rename_modal.title'|trans(_trans_parameters, 'EasyAdminBundle') }}</h4>
                <p>{{ 'rename_modal.content'|trans(_trans_parameters, 'EasyAdminBundle') }}</p>
                <br />
                <input class="form-control" type="text" />
            </div>
            <div class="modal-footer">
                <button type="button" data-dismiss="modal" class="btn">
                    {{ 'action.cancel'|trans(_trans_parameters, _translation_domain) }}
                </button>

                {% if easyadmin_action_is_enabled(view, 'rename', _entity_config.name) %}
                    {% set _rename_action = easyadmin_get_action(view, 'rename', _entity_config.name) %}
                    <button type="button" data-dismiss="modal" class="btn btn-danger" id="modal-rename-button" formtarget="{{ _rename_action.target }}">
                        {% if _rename_action.icon %}<i class="fa fa-{{ _rename_action.icon }}"></i>{% endif %}
                        {{ 'rename_modal.action'|trans(_trans_parameters, 'EasyAdminBundle') }}
                    </button>
                {% endif %}
            </div>
        </div>
    </div>
</div>

In config.yml is a new option:

list:
                actions:
                    rename:    { name: rename,    type: method, label: 'Rename', css_class: 'btn btn-primary', icon: pencil }

In list.html.twig which I'm using:

{% block main %}

{% block rename_form %}
        {% set referer = paginator.currentPage == paginator.nbPages and 1 != paginator.currentPage and 1 == paginator.currentPageResults.count
            ? path('easyadmin', app.request.query|merge({ page: app.request.query.get('page') - 1 }))
            : app.request.requestUri
        %}

        {{ include('@EasyAdmin/default/includes/_simple_form.html.twig', {
            view: 'list',
            referer: referer|url_encode,
            rename_form: rename_form_template,
            _translation_domain: _entity_config.translation_domain,
            _trans_parameters: _trans_parameters,
            _entity_config: _entity_config,
        }, with_context = false) }}
    {% endblock rename_form %}    
{% endblock %}

{% block body_javascript %}
    {{ parent() }}
    <script type="text/javascript">
    $(function() {
        $('#modal-rename-button').on('click', function(e) {
            e.preventDefault();

            var name = $('#name').val();

            var renameForm = $('#rename-form');
                    renameForm.attr('action', renameForm.attr('action').replace('__name__', name));
        });

        $('a.action-rename').on('click', function(e) {
            e.preventDefault();
            var id = $(this).parents('tr').first().data('id');

            $('#modal-rename').modal({ backdrop: true, keyboard: true })
                .off('click', '#modal-rename-button')
                .on('click', '#modal-rename-button', function () {
                    var renameForm = $('#rename-form');
                    renameForm.attr('action', renameForm.attr('action').replace('__id__', id));
                    renameForm.trigger('submit');
                });
        });
    });
</script>
{% endblock %}

And finally controller:

protected function createRenameForm($entityName, $entityId, $name)
    {
        $formBuilder = $this->get('form.factory')->createNamedBuilder('rename_form')
            ->setAction($this->generateUrl('easyadmin', array('action' => 'rename', 'entity' => $entityName, 'id' => $entityId, 'name' => $name)))
            ->setMethod('POST')
        ;

        $formBuilder->add('submit', LegacyFormHelper::getType('submit'), array('label' => 'rename_modal.action', 'translation_domain' => 'EasyAdminBundle'));
        $formBuilder->add('_easyadmin_rename_flag', LegacyFormHelper::getType('hidden'), array('data' => '1'));

        return $formBuilder->getForm();
    }

    public function listAction() {
        $this->dispatch(EasyAdminEvents::PRE_LIST);

        $fields = $this->entity['list']['fields'];
        $paginator = $this->findAll($this->entity['class'], $this->request->query->get('page', 1), $this->config['list']['max_results'], $this->request->query->get('sortField'), $this->request->query->get('sortDirection'), $this->entity['list']['dql_filter']);

        $this->dispatch(EasyAdminEvents::POST_LIST, array('paginator' => $paginator));

        return $this->render($this->entity['templates']['list'], array(
            'title' => 'Branches',
            'entity' => $this->entity['name'],
            'currentBranch' => $this->repo->getCurrentBranchName(),
            'paginator' => $paginator,
            'fields' => $fields,
            'delete_form_template' => $this->createDeleteForm($this->entity['name'], '__id__')->createView(),
            'rename_form_template' => $this->createRenameForm($this->entity['name'], '__id__', '__name__')->createView(),
        ));
    }

Answer 1

I had a similar issue because I wanted to show a modal before to perform a custom action. So what I did was modify the button action with jquery

$(document).ready(function () {
    var $archiveButton = $('a.action-archive');

    $archiveButton.attr('href', '#');
    $archiveButton.attr('data-toggle', 'modal');
    $archiveButton.attr('data-target', '#archive-modal');
    $archiveButton.attr('data-url', '/url/to/load/form/inside/modal/body');
});

I don't know if it is the better way, but it helped me to show some info to the user before execute the archiveAction() in the AdminController

EDITED: a way to access POST variables

You can access to POST variables through the Container

public function renameAction()
    {
        $name = $this->container->get('request')->get('your variable');
        var_dump($name);
        die();
        return $this->redirectToRoute('admin', ['entity' => 'Branch', 'action'     => 'list']);
    }

Play a while with the $this->container->get('request') to find what you are looking for