Q:

w2ui - toolbar change button image on click

I am using w2ui. I have a toolbar with one button. This button has the icon-image "icon-delete".
When I click on the button, I want it to change the icon-image to "icon-add", but my code doesn't work.
toolbar: {
    items: [{
        type: 'button',
        id: 'hide',
        caption: 'Menü',
        img: 'icon-delete'
    }],
    onClick: function (target, data) {
        if (target == 'hide') {
            this.items.img('icon-add');
        }
    }
}

A:

You can use toolbar.set() method to update toolbar button icon. So in your onClick event do the following:
onClick: function (target, data) {
   this.set(target, { icon: 'new_icon' });
}

See more here: http://w2ui.com/web/docs/w2toolbar.set

A:

I created a hidden button "show" with the "icon-add" image.
when the button "hide" is clicked, it get hidden and the button "show" get shown.
toolbar: {
            name: 'toolbar',
            items: [
                { type: 'button',  id: 'hide', caption: 'Menü', img: 'icon-delete' },
                { type: 'button',  id: 'show', hidden: 'true', caption: 'Menü', img: 'icon-add' }
            ],
            onClick: function (target, data) {
                if (target == 'hide' ) {w2ui['layout'].toggle('left', window.instant);

                                        this.hide('hide');
                                        this.show('show');
                                        }
                if (target == 'show' ) {w2ui['layout'].toggle('left', window.instant);

                                        this.hide('show');
                                        this.show('hide');
                                        }                       

            }
        }

