onClick

присоединяет обработчик клика для частей компонента с указанным классом CSS

Example

webix.ui({
    view:"list",
    template:"#value# <div class='webix_remove_upload'>Del</div>"
    onClick:{
        "webix_remove_upload":function(ev, id){
            this.remove(id);
            return false; // блокирует стандартное поведение клика
        }
    }
});

Related samples

• Поведение "onClick" определено для областей и элементов компонента, а не для всего компонента
• Используйте обработчик "onItemClick" для обработки кликов по элементам (без указания класса);
• для обработки кликов по кнопкам Webix лучше использовать свойство click;
• обработчик onClick может переопределить стандартное событие onclick:

webix.ui({
    view:"datatable",
    columns:[
        { id:"rank",    header:"", css:"rank",  width:50},
        { id:"title",   header:"Film title",    width:200},
        { template:"<input class='delbtn' type='button' value='Delete'>", width:100 }],        
    on:{
        // поведение клика по умолчанию, которое верно для любой ячейки datatable
        "onItemClick":function(id, e, trg){ 
            webix.message("Click on row: " + id.row+", column: " + id.column)
        }
    }, 
    // поведение клика для ячейки с кнопкой с классом 'delbtn'
    onClick:{ 
        "delbtn":function(e, id, trg){
            webix.message("Delete row: "+id); 
            return false; // здесь он блокирует поведение по умолчанию
        }
    },
    data:grid_data
});

• обратите внимание на возвращение false из обработчика onClick в приведенном выше примере. Он блокирует все дальнейшие события, связанные с кликами: onBeforeSelect, onAfterSelect, onSelectChange, onItemClick. Чтобы проверить полный стек заблокированных событий, нужно включить отладочную версию библиотеки Webix.

Наверх