Programmatically edit Wrapper DIV classes?

Veena Vikraman  wrote a similar component that uses Sling Models and HTL for a grid component that is authored - Creating a custom Touch UI Grid Component for Adobe Experience Manager

We're trying to implement a solution a bit more dynamic than this to allow grids to be more freely authored. I think we'd still like to see if there's a way to programmatically change the wrapper classes for a component OR use a component's HTL to include another component that has it's dialog as still being author-able.

The only think i can think of is adding more sizes to the dialog and then having the back end Java ColumnControl code render those sizes.

No - just the classes the wrapper component writes; but I need to be able to change them dynamically.

I am not aware of an AEM specific API to change the DIV classes other then standard JS

html - Change an element's class with JavaScript - Stack Overflow

Ok - Is there a way to include a component (parent) in another component (child) and have the child component's dialog and parsys still work?

Hi,

There is Java API which you can use to handle decoration tags

com.day.cq.wcm.api.components ("The Adobe AEM Quickstart and Web Application.")

https://www.codermag.net/2016/02/remove-component-wrapper-divs-in-cqaem.html

The problem with that is that if we hide the wrapper completely; then the dialog doesn't work :/

Also - I've tried `.getOptions(getRequest(), true).getCssClassNames().add("TEST_CELL");` for IncludeOptions and it doesn't seem to work.

HI,

I tried above code in AEM 6.3, it does work but it does allow you to add extra decorative tag. I won't let you to add class.

Component jsp file -

<%@page session="false"%><%@ page import="com.day.cq.wcm.foundation.Placeholder,com.day.cq.wcm.api.components.IncludeOptions" %>

<%@include file="/libs/foundation/global.jsp"%>

<%

   IncludeOptions opts = IncludeOptions.getOptions(request, true);

   opts.setDecorationTagName("");

%>

Output with opts.setDecorationTagName(""); and opts.setDecorationTagName("arun-test");

Arun - yes; you can change the tag name, but I'm looking to change the name of the classes. Also - as I understand it, if you ​remove the tag, then the component becomes un-editable.