Datatable & masterCheckbox CSS

#1

Hi team,

Is it possible to apply webix css checkbox theme on the master checkbox please ?

https://snippet.webix.com/dedx35xe

Regards,
Xavier

#2

Greetings, @XavierDP

For such purpose you can create your own “masterCheckbox” by extending the existing one:

webix.ui.datafilter.masterCheckbox = webix.extend({
	refresh(master, node, config) {
		node.onclick = () => {
			config.checked = !config.checked;
			node.innerHTML = this.render(master, config);

			let column = master.getColumnConfig(config.columnId);
			let checked = config.checked ? column.checkValue : column.uncheckValue;

			master.data.each((obj) => {
				obj[config.columnId] = checked;
				master.callEvent("onCheck", [obj.id, config.columnId, checked]);
				master.data.callEvent("onStoreUpdated", [obj.id, obj, "save"]);
			});
			master.refresh();
		};
	},
	render(master, config) {
		return `<span class="customIcon mdi mdi-24px mdi-checkbox-${config.checked ? "marked" : "blank-outline"}"></span>`;
	}
}, webix.ui.datafilter.masterCheckbox);

Here is an example: Code Snippet

#3

Hi @NastassiaM

Perfect !

Thank you very much