Kendo UI Grid - Gruppiertabelle Header

Question

Ich möchte die Funktionalität von Collapse/Alles erweitern (in AngularJs) für gruppierte Kendo UI Grid implementieren und es der Grid-Header hinzufügen. Haben Sie eine Idee, wie ich meine Funktionalität dort einfügen könnte (siehe die angehängte Datei). Vielen Dank!

var expandCollapseAll = document.createElement('button'); 
expandCollapseAll.innerHTML = ">"; 
var elementToAppend = document.getElementsByClassName("k-group-cell k-header"); 
elementToAppend[0].appendChild(expandCollapseAll); 
expandCollapseAll.onclick = toggleExpandCollapse; 

Die toggleExpandCollapse Funktion auslösen würde das click Ereignis aller .k-icon.k-collapse und .k-icon.k-expand Elemente auf dem Gitter:

Dojo with a normal grid with grouping activated

Answer 1

Sie können ein button Element auf k-group-cell k-header Element dynamisch erstellen.

alle kollabieren:

$("#grid").find(".k-icon.k-expand").trigger("click"); 

Ich habe die oben in Aktion eine sample JSFiddle zu demonstrieren haben:

$("#grid").find(".k-icon.k-collapse").trigger("click"); 

alle zu erweitern.

HINWEIS: Die CSS der Schaltfläche ist ein wenig aus, aber das sollte genug sein, um Sie in Gang zu bringen :)