notation déclarative – devfrontend.info

Voir aussi: [Magento 2] Exploiter le widget javascript jQuery natif Accordion dans le fichier PHTML des filtres produit (page category).

Source: Magento 2.3 DevDocs (officiel) – Modal widget sample code.

L’exemple suivant montre comment, en notation déclarative (bonne pratique dans Magento 2), initialiser le widget Modal et passer des options pendant l’initialisation. Il montre également comment ouvrir la modale en cliquant sur un bouton.

<button type="button" class="action" data-trigger="trigger">
    <span data-bind="i18n: 'Click Here'"></span>
</button>
<div data-bind="mageInit: {
        'Magento_Ui/js/modal/modal':{
            'type': 'popup',
            'title': 'Popup title',
            'trigger': '[data-trigger=trigger]',
            'responsive': true,
            'buttons': [{
                text: $.mage.__('Submit'),
                class: 'action'
            }]
        }}">
    <div class="content">
        Popup Content
    </div>
</div>

</button>

<div data-bind="mageInit: {

'Magento_Ui/js/modal/modal':{

'type': 'popup',

'title': 'Popup title',

'trigger': '[data-trigger=trigger]',

'responsive': true,

'buttons': [{

text: $.mage.__('Submit'),

class: 'action'

}]

}}">

Popup Content

</div>

Articles récents

Catégories

Archives

Méta

Étiquette : notation déclarative