You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@myfaces.apache.org by Ma...@sanofi-aventis.com on 2008/01/10 15:58:14 UTC

problem with t:htmlTag and tree2

Hi,

 

I'm not sure if this is a bug but this has been driving me crazy for the
last hour or so. I have a modified tree2 to work with Ajax (via
Ajax4Jsf). 

 

So the resulting code for the tree looks like this:

 

            <t:tree2 

                  value="#{mbDocuments.model}" 

                  clientSideToggle="false"

                  var="node" 

                  varNodeToggler="t" 

                  showRootNode="false" 

                  id="DocTree" >

 

                  <f:facet name="root"/> 

 

                  <%-- Facet for expandable folders --%>

                  <f:facet name="treeFolder">

                        <a4j:commandLink 

                             action="#{t.toggleExpanded}" 

                             actionListener="#{mbDocuments.toggle}"

                             reRender="DocTree"

                             value="#{node.data.msEltLabel}" 

                             immediate="false" >

 

                             <f:param name="docId"
value="#{node.data.msEltId}"/>

                             

                        </a4j:commandLink>

                  </f:facet>

 

                  <%-- Facet for files --%>

                  <f:facet name="treeFile">

                        <t:commandLink 

                              value="#{node.data.msEltLabel}"  

                              action="LoadDocument" />

                        

                  </f:facet>

            </t:tree2>

 

When I say modified tree2, I mean specifically the renderer. What you
see above works just fine. I ran into some issues with formatting that
would have required me to put some very specific css things directly
into the renderer. To avoid this I figured I could just pull some of
that directly into the JSP page. I'm using <ul> and <li> to display the
tree, instead of tables... so originally I had the <li> come from the
renderer. But we want specific CSS classes depending on the item. So
after removing it from the renderer I ended up with this:

 

                  <%-- Facet for expandable folders --%>

                  <f:facet name="treeFolder">

                        <t:htmlTag value="li"
styleClass="#{t.nodeExpanded ? 'FolderLinkOpen' : 'FolderLink'}">

                             <a4j:commandLink 

                                   action="#{t.toggleExpanded}" 

 
actionListener="#{mbDocuments.toggle}"

                                   reRender="DocTree"

                                   value="#{node.data.msEltLabel}" 

                                   immediate="false" >

      

                                   <f:param name="docId"
value="#{node.data.msEltId}"/>

                                   

                             </a4j:commandLink>

                        </t:htmlTag>

                  </f:facet>

 

                  <%-- Facet for files --%>

                  <f:facet name="treeFile">

                        <t:htmlTag value="li"
styleClass="FileLink#{node.data.msEltType}">

                             <t:commandLink 

                                   value="#{node.data.msEltLabel}"  

                                   action="LoadDocument" />

                        </t:htmlTag>

                  </f:facet>

 

Now the result of this was not so nice. Basically the facets seems to
generate an extra <li>. I tested this by removing the t:htmlTag from the
treeFolder. Now after that the initial load appeared fine, but as soon
as I expand any node of the tree I get all kinds of extra <li>s all over
the place. It's hard to explain exactly what I mean here, but I tried
experimenting with removing the tag from the treeFolder facet, and then
when I expand a node, I can look at the DOM inspector and I'll see an
<li> surrounding a group of folders. If an expanded node has many files,
there will be an extra <li> in between each one. I thought maybe this
had to do with ajax4jsf. But then I tried something else, I tried
replacing <li> with <span> just to see if it would generate spans all
over the place and it worked just fine. This is why I think it may be
bug, but at the same time this seems like a very strange bug (if it is a
bug)... I don't have a test case at the moment but if I can't get this
working soon I may have to create a simple test case. Hopefully that
will reveal an error on my part... I find with JSF it's very easy to
overlook a minor detail and spend a while figuring out why it doesn't
work. But I guess this framework takes some practice. 

 

Thanks for any help on this.

Matt