Add button with confirmation message

Can I add a button with a confirmation message like the delete button without using JavaScript ?

Topic

[Mike KudelyaParticipant]

Hi

Are we talking about these grid buttons ? If no, please show me your button.

[jnetoParticipant]

In the view.html.twig of my entity, i need to use the UI.button and/or UI.dropdownItem

PHP

{{ UI.dropdownItem({ 'path': path('notification_send_email', {id:entity.id}), 'title': 'Send Email', 'label': 'Send Email' }) }}

1 2 3 4 5

{{ UI.dropdownItem({                     'path': path('notification_send_email', {id:entity.id}),                     'title': 'Send Email',                     'label': 'Send Email'                 }) }}

but i need to send a confirmation message, in case the user click the button by mistake.

Thanks

[Mike KudelyaParticipant]

Hi

Here is my example, if you want, you can make it better:

XHTML

{{ UI.button({ 'path' : path('oro_calendar_event_index'), 'iCss': 'icon-time', 'label': 'oro.calendar.view_events'|trans, 'title': 'oro.calendar.view_events'|trans, 'confirmation': { id: 'test_button', content: 'Are you sure?', ok: 'Submit', cancel: 'Cancel' } }) }}

1 2 3 4 5 6 7 8 9 10 11 12

{{ UI.button({             'path' : path('oro_calendar_event_index'),             'iCss': 'icon-time',             'label': 'oro.calendar.view_events'|trans,             'title': 'oro.calendar.view_events'|trans,             'confirmation': {                 id: 'test_button',                 content: 'Are you sure?',                 ok: 'Submit',                 cancel: 'Cancel'             }         }) }}

Add this IF to the end of link macros:

XHTML

{% if parameters.confirmation is defined %} <script type="text/javascript"> require(['jquery', 'orotranslation/js/translator', 'oroui/js/delete-confirmation', 'oroui/js/mediator'], function ($, __, confirmation, mediator) { $(document).ready(function () { $('#{{ parameters.confirmation.id }}').on('click', function () { var confirm = new confirmation({ content: __('{{ parameters.confirmation.content }}'), okText: __('{{ parameters.confirmation.ok }}'), cancelText: __('{{ parameters.confirmation.cancel }}') }); confirm.on('ok', _.bind(function () { mediator.execute('redirectTo', {url: '{{ parameters.path }}'}, {redirect: true}); }, this)); confirm.open(); return false; }); }); }); </script> {% endif %}

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

{% if parameters.confirmation is defined %}         <script type="text/javascript">             require(['jquery', 'orotranslation/js/translator', 'oroui/js/delete-confirmation', 'oroui/js/mediator'],                     function ($, __, confirmation, mediator) {                         $(document).ready(function () {                             $('#{{ parameters.confirmation.id }}').on('click', function () {                                 var confirm = new confirmation({                                     content: __('{{ parameters.confirmation.content }}'),                                     okText: __('{{ parameters.confirmation.ok }}'),                                     cancelText: __('{{ parameters.confirmation.cancel }}')                                 });                                 confirm.on('ok', _.bind(function () {                                     mediator.execute('redirectTo', {url: '{{ parameters.path }}'}, {redirect: true});                                 }, this));                                   confirm.open();                                   return false;                             });                         });                     });         </script>     {% endif %}

[jnetoParticipant]

Thanks. I will try it.

My idea was not using custom JavaScript. I read the actionbundle documentation and I was hoping that the confirmation message could be achieved with configuration of the ui button macro call.

[Author]

Replies