Hi Gordon,
Responsive Containers indeed cannot be manipulated at runtime using elements.xxx as they are not stateful.
You can still achieve your desired behavior of hiding some flex-item under certain conditions.
You have 2 possible approaches, both valid, is just a matter of preference which you like the best.
1) you can add a specific class to the flex-item you want to target in CSS ( e.g. : my-flex-item-1 ).
You can then use plugins.ngclientutils.addFormStyleClass(formname,styleclass) ( and plugins.ngclientutils.removeFormStyleClass(formname,styleclass)) to add/remove a styleclass to the form (.e.g hide-my-flex-item-1)
In CSS you can then use the combination of these 2 classes to hide your flex item; since the flex-item will be nested within your form's DIV, you can use such CSS:
- Code: Select all
// target the my-flex-item nested at any level within the hide-my-flex-item-1
.hide-my-flex-item-1 .my-flex-item-1 {
display: none;
}
2) an alternative approach can be to make your flex-item a Form Component and add it to the form using the Form Component Container. The Form Component Container has a styleClass property which can be manipulated at runtime, therefore you can add/remove the class "hidden", which will set display to none to the Form Component Container itself.
Regards,
Paolo