CODEWITHSUNDEEP
javascriptjqueryjquery-uidrupaldrupal-8
mixerowsky
mixerowsky

Reputation: 217

jQuery UI Dialog default options

I'm using jQuery UI Dialog from Drupal 8 core (jQuery UI Dialog 1.11.4) to show node in modal, but default options doesn't suits me and I need to change them.

To show node (node id 12 in this example) in modal I'm using this from Drupal:

<a class="use-ajax" data-dialog-type="modal" href="/node/12">SHOW NODE</a>

I tried to change defaults like this:

$.extend($.ui.dialog.prototype.options, {
            modal: true,
            width: '100%',
            height: '100%',
            fluid: true,
            resizable: false,
            closeText: Drupal.t('Close it'),
            hide: 'fadeOut',
            show: 'fadeIn'
          });

but I'm got empty modal with options I defined.

How I can just change these options and make it work?

Upvotes: 0

Views: 2393

Answers (1)

Akshaya K T
Akshaya K T

Reputation: 195

You can add options to Dialog using "data-dialog-options" attribute. For example:

<a class="use-ajax" data-dialog-type="modal" data-dialog-options='{"width":"100%", "height":"100%", "fluid":"true", "resizable":"false", "hide":"fadeOut", "show":"fadeIn"}' href="/node/12">SHOW NODE</a>

Upvotes: 1

Related Questions