Expand & Collapse Sidebar

Hi,

an easy way to do that would be to just show and hide the gridLayout. You can write two functions like this:

$scope.showPanel = function(){
 $scope.view.wdg["gridLayout-1"].visible = true;
}

$scope.hidePanel = function(){
 $scope.view.wdg["gridLayout-1"].visible = false;
}

Then call showPanel(); from the button Click event and hidePanel(); from the Selected event of the checkboxes.

Also link the Selected event to the Play and Forward service of your model.

I hope this helps.

Additonally to solution provided by  @sebben  I want to mention the option to use popup widget. I remember that I used in an old project for similar task  different numbers of  popus as conainer for different checkbox lists.

Also , it  is possible to use an repeat widget where the data is commming from a service - but this requires a service to collect or to generate data (only in javascript).  The most simple solution is to use static list of checkbox widget added to the popup as shown on the picture :

The popup could be shown via call like:

$timeout($scope.$root.$broadcast('app.view["Home"].wdg["popup-1"].svc.showpopup'),100);
//or hide it
$timeout($scope.$root.$broadcast('app.view["Home"].wdg["popup-1"].svc.hidepopup'),100);