ModalElement

The Modal Element allows to get simple access to the modal element using the event system.

Methods #

getHeader

Returns: Dom

Get the Dom object of modal header element.

(function($K)
{
    $K.add('module', 'mymodule', {
        init: function(app, context)
        {
            this.app = app;

            // define service
            this.modal = app.modal;
        },
        onmessage: {
            modal: {
                opened: function(sender, $modal, $form)
                {
                    var $header = $modal.getHeader();
                }
            }
        },
        showModal: function()
        {
            this.modal.open({
                url: '/server-side/my-modal.html',
                title: 'My Modal'
            });
        }
    });
})(Kube);

getBody

Returns: Dom

Get the Dom object of modal body element.

(function($K)
{
    $K.add('module', 'mymodule', {
        init: function(app, context)
        {
            this.app = app;

            // define service
            this.modal = app.modal;
        },
        onmessage: {
            modal: {
                opened: function(sender, $modal, $form)
                {
                    var $header = $modal.getBody();
                }
            }
        },
        showModal: function()
        {
            this.modal.open({
                url: '/server-side/my-modal.html',
                title: 'My Modal'
            });
        }
    });
})(Kube);

getFooter

Returns: Dom

Get the Dom object of modal footer element.

(function($K)
{
    $K.add('module', 'mymodule', {
        init: function(app, context)
        {
            this.app = app;

            // define service
            this.modal = app.modal;
        },
        onmessage: {
            modal: {
                opened: function(sender, $modal, $form)
                {
                    var $header = $modal.getFooter();
                }
            }
        },
        showModal: function()
        {
            this.modal.open({
                url: '/server-side/my-modal.html',
                title: 'My Modal'
            });
        }
    });
})(Kube);

setTitle

Arguments
title String the modal title

Set or change the modal title.

(function($K)
{
    $K.add('module', 'mymodule', {
        init: function(app, context)
        {
            this.app = app;

            // define service
            this.modal = app.modal;
        },
        onmessage: {
            modal: {
                opened: function(sender, $modal, $form)
                {
                    $modal.setTitle('My New Title');
                }
            }
        },
        showModal: function()
        {
            this.modal.open({
                url: '/server-side/my-modal.html',
                title: 'My Modal'
            });
        }
    });
})(Kube);