common.onRefresh

onRefresh = function(event)

オブジェクトを更新した時に呼び出されます。

このイベントは全w2uiウィジェット(Layout, Grid, Toolbar, Sidebar, Tabs, Form)で共通に利用可能なイベントです。 オブジェクト作成時にイベントリスナーとして指定します。

$('#layout').w2layout({
    name    : 'layout',
    panels  : [
        { type: 'top', size: 40 },
        { type: 'preview', size: 200 }
    ],
    onRefresh: function(event) {
        console.log('object '+ event.target + ' is refreshed');
    }        
});

または、オブジェクト生成後に指定します。

w2ui.layout.on('refresh', function(event) {
    console.log('object '+ event.target + ' is refreshed');
});

このイベントハンドラはデフォルトのアクションの前に呼び出されます。 デフォルトアクションを取り消すにはevent.preventDefault()を使います。 このイベントが完全に終わった後にデフォルトアクションを走らせるには、event.onCompleteを使います。 より詳しく知りたい場合はutils:eventsを参照して下さい。

生成したコンテンツに対してのイベント追加

通常、Gridや、Sidebar等で生成したコンテンツに対して、直接イベントを追加すべきではありません。 しかし、HTMLで<... onclick="...">と指定したり、jQueryを使ってイベント追加することができます。 それらをevent.onCompleteを使って追加する必要があります。

w2ui.layout.on('refresh', function(event) {
    event.onComplete = function () {
        $(this.box).find('#..').on('click', function () {
            // do my staff
        });
    }
});

Layout, Sidebar, Toolbar, Tabs

Layout、Sidebar、Toolbar、Tabsの場合、onRefreshは更新したパネル（ノード、アイテム、タブ）毎に発生します。 そのため、引数としてどのパネル（ノード、アイテム、タブ）を更新するのか指定する必要があります。

デモ

「Refresh」ボタンをクリックすると、top、left、main、 preview、right、bottomのそれぞれのconsole.logが出力されます。

JavaScript

$('#layout').w2layout({
    name    : 'layout',
    panels  : [
        { type: 'top', size: 40, content: 'top' },
        { type: 'preview', size: 200, content: 'top' }
    ],
    onRefresh: function(event) {
        console.log('object '+ event.target + ' is refreshed');
    }
});
$('#event-btn').on('click', function(){
    w2ui['layout'].refresh();
});