Customize GlobalViewsConfirmationView

we can customize default global modals using the below sample code.

        events: {

            'click [data-action="Show-optional-text"]': 'Showoptionaltext'
        },
        Showoptionaltext: function (e) {
            e.preventDefault();

// customize GlobalViewsConfirmationView
            var orderApprovalDetailConfirmationView = new GlobalViewsConfirmationView({
                callBackParameters: {
                    target: e.target,
                    context: this
                },
                title: 'Decline order',
                body: '<a> Do you want to decline this order?</a> <br> <textarea> </textarea>',
                specialdata: {},
                autohide: true
            });
            this.options.application.getLayout().showInModal(orderApprovalDetailConfirmationView);
            // Update the button text to "Confirm" using jquery
            $(document).ready(function () {
                $('.global-views-confirmation-confirm-button').text('Confirm');

            });
        },

Note:For displayinga text area in the body section u need to go to the corresponding theme template (global_views_confirmation.tpl) and make {{body}} to {{{body}}}

<div class="global-views-confirmation-body {{className}}">
	{{#if showBodyMessage}}
		{{{body}}}
	{{else}}
		<div data-view="ChildViewMessage"></div>
	{{/if}}
</div>

Leave a comment

Your email address will not be published. Required fields are marked *