Highlighted

Programmatically edit Wrapper DIV classes?

ronaldd85054752

15-10-2018

Hey folks,

I'm working on a custom grid building component. The problem I'm having is that the wrapper div is negatively effecting my ability to build columns (the columns set a width of the parent, but on the author this looks weird, because the column's parent is actually the wrapper, not the row element)

I know I can remove the wrapper, but then the column isn't editable, which won't work for me. I know I could use the cq:htmlTag node to edit the tag, class and id - but because the size of the column is author-able, I need a way from the java side to add a class to the wrapper.

Any ideas or an alternate suggestion?

Thanks!

Replies

Highlighted

ronaldd85054752

18-10-2018

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.

Highlighted

smacdonald2008

18-10-2018

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.

Highlighted

ronaldd85054752

18-10-2018

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?

Highlighted

ronaldd85054752

18-10-2018

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.

Highlighted

Arun_Patidar

MVP

19-10-2018

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");

Screenshot 2018-10-19 at 10.58.27 PM.png

Screenshot 2018-10-19 at 10.56.37 PM.png