-
1. Re: Drag and Drop
ilya_shaikovsky Aug 17, 2009 8:40 AM (in response to alclientview)seems like some kind of conflicts with your externally included js libraries,.. do you have prototype or jquerry manually added to page?
-
2. Re: Drag and Drop
alclientview Aug 17, 2009 11:27 PM (in response to alclientview)Hi,
Thanks for the quick reply!
I run this on JBoss 4.2.3. After your post, I created one specific web application to test it and I get the same problem. Then I thought I should try in another container in case there is a library conflict with the container.
So I installed Tomcat 6, I made sure I have the required libraries (from the 3.2.1. Adding RichFaces libraries into the project of the Developer Guide) and I have exactly the same problem. The dragging feature won't just work and the same error in the Firefox (3.5.2) error console. Does not work either in IE 6.
Any other idea ? I need this feature... And I really don't know what to do to make it work with this basic example.
Arnaud. -
3. Re: Drag and Drop
alclientview Aug 18, 2009 12:13 AM (in response to alclientview)Hi again,
I just did another test. I put the richfaces-demo-3.3.1.GA-jee5.war in my tomcat 6 container and the Drag and Drop works fine. Then I replaced the libraries I was using in my testing webapp with all the libraries of the richfaces-demo-3.3.1.GA-jee5.war.
When I restarted the server, I had first an exception related to Seam. So I removed the Seam libs (since my testing webapp does not use Seam) and restarted the server again. I can access my testing webapp but I still have the same problem (dragging feature does not work).
I don't know anything about Seam except it is a framework using JSF (and many others technologies) but at this time I only see this difference between my testing web application and the richfaces demo war file.
So I'm wondering about thoses seam libraries... ?
Arnaud. -
4. Re: Drag and Drop
alclientview Aug 18, 2009 2:28 AM (in response to alclientview)Hi,
Me again after some more testing:
You can reproduce what I am describing on the richfaces online demo web site.
If you try to access directly the JSF page: http://livedemo.exadel.com/richfaces-demo/richfaces/tree/examples/simpleDnd.jsf
You'll get the problem I described above... Dragging element from/to the Tree does not work.
Now if you try: http://livedemo.exadel.com/richfaces-demo/richfaces/tree/simple-tree-dnd.jsf
This will work. But looking at the content of simple-tree-dnd.xhtml does not tell me why. Besides including the above page (simpleDnd.jsf) and the source code, it seems to me it does not do much so it is still a mystery to me and I still don't know how to make it work...?
Arnaud. -
5. Re: Drag and Drop - bug ???
alclientview Aug 18, 2009 3:28 AM (in response to alclientview)This is my last post before getting some feedback from you guys... I'm not sure this help to understand or not but in case:
If I had the following to the top of the simpleDnd.xhtml (just right after the <ui:composition> tag):
there is no error and the drag and drop feature works!!!
Is there someone out there who has used the drag and drop feature and how did you make it work ? Just a very simple example such as the demo web site and I'll be very happy... To me there is a bug or I really miss something...
Thanks in advance,
Arnaud. -
6. Re: Drag and Drop
alclientview Aug 18, 2009 4:03 AM (in response to alclientview)Sorry, I had not userd BBCode and disabled HTML in the previous page.
If I had the following lines at the top of the page:<ul> <li> </li> </ul>
there is no error it and the drag and drop feature works fine.
It is easy to test, the following code (copied from the live demo) does not work:<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"> <style> .col1, .col2 { width:50%; vertical-align:top; } .rich-table-cell, .rich-table{ border:none; } .indicatorPicture { width: 80px; } </style> <rich:dragIndicator id="indicator1" > <f:facet name="single"> <h:graphicImage styleClass="indicatorPicture" value="/richfaces/jQuery/images/{draggedImage}" /> </f:facet> </rich:dragIndicator> <rich:dragIndicator id="indicator2" /> <h:form> <h:panelGrid columns="2" width="100%" columnClasses="col1,col2"> <rich:tree ajaxKeys="#{null}" style="width:300px" nodeSelectListener="#{simpleTreeDndBean.processSelection}" reRender="selectedNode" ajaxSubmitSelection="true" switchType="client" dragIndicator="indicator2" value="#{simpleTreeDndBean.treeNode}" var="item" id="tree" treeNodeVar="treeNode" dropListener="#{simpleTreeDndBean.dropListener}" nodeFace="#{treeNode.parent.parent == null ? 'node' : 'leaf'}"> <rich:treeNode type="node" acceptedTypes="pic" icon="#{treeNode.icon}" iconLeaf="#{treeNode.leafIcon}"> <h:outputText value="#{item}"/> </rich:treeNode> <rich:treeNode type="leaf" dragType="pic"> <rich:dndParam name="label" type="drag">#{item}</rich:dndParam> <h:outputText value="#{item}"/> </rich:treeNode> </rich:tree> <rich:panel id="selectedNode"> <rich:dataGrid id="selectedNodeGrid" style="display: #{!empty simpleTreeDndBean.selectedNodeChildren ? '' : 'none'}" value="#{simpleTreeDndBean.selectedNodeChildren}" var="item" columns="3" border="0"> <rich:dragSupport dragIndicator="indicator1" dragType="pic" dragValue="#{item}" reRender="selectedNodeGrid"> <rich:dndParam name="draggedImage" value="#{item.data}"/> </rich:dragSupport> <h:graphicImage value="/richfaces/jQuery/images/#{item.data}" /> </rich:dataGrid> </rich:panel> </h:panelGrid> </h:form> </ui:composition>
But the same code with<li></li>
will work:<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"> <ul> <li> </li> </ul> <style> .col1, .col2 { width:50%; vertical-align:top; } .rich-table-cell, .rich-table{ border:none; } .indicatorPicture { width: 80px; } </style> <rich:dragIndicator id="indicator1" > <f:facet name="single"> <h:graphicImage styleClass="indicatorPicture" value="/richfaces/jQuery/images/{draggedImage}" /> </f:facet> </rich:dragIndicator> <rich:dragIndicator id="indicator2" /> <h:form> <h:panelGrid columns="2" width="100%" columnClasses="col1,col2"> <rich:tree ajaxKeys="#{null}" style="width:300px" nodeSelectListener="#{simpleTreeDndBean.processSelection}" reRender="selectedNode" ajaxSubmitSelection="true" switchType="client" dragIndicator="indicator2" value="#{simpleTreeDndBean.treeNode}" var="item" id="tree" treeNodeVar="treeNode" dropListener="#{simpleTreeDndBean.dropListener}" nodeFace="#{treeNode.parent.parent == null ? 'node' : 'leaf'}"> <rich:treeNode type="node" acceptedTypes="pic" icon="#{treeNode.icon}" iconLeaf="#{treeNode.leafIcon}"> <h:outputText value="#{item}"/> </rich:treeNode> <rich:treeNode type="leaf" dragType="pic"> <rich:dndParam name="label" type="drag">#{item}</rich:dndParam> <h:outputText value="#{item}"/> </rich:treeNode> </rich:tree> <rich:panel id="selectedNode"> <rich:dataGrid id="selectedNodeGrid" style="display: #{!empty simpleTreeDndBean.selectedNodeChildren ? '' : 'none'}" value="#{simpleTreeDndBean.selectedNodeChildren}" var="item" columns="3" border="0"> <rich:dragSupport dragIndicator="indicator1" dragType="pic" dragValue="#{item}" reRender="selectedNodeGrid"> <rich:dndParam name="draggedImage" value="#{item.data}"/> </rich:dragSupport> <h:graphicImage value="/richfaces/jQuery/images/#{item.data}" /> </rich:dataGrid> </rich:panel> </h:panelGrid> </h:form> </ui:composition>
-
7. Re: Drag and Drop
ilya_shaikovsky Aug 18, 2009 5:16 AM (in response to alclientview)as you not using templatye for the page - add html-head-body tags and f:view with contentType="text/html" around your page code. (ui:composition does not produce it)
-
8. Re: Drag and Drop
alclientview Aug 18, 2009 7:11 AM (in response to alclientview)yes, I was missing something! Thank you!!!
Arnaud.