2 Replies Latest reply on Oct 7, 2008 3:01 PM by Senthil Chidambaram

    drag and drop component

    Senthil Chidambaram Newbie

      Hi,
      I'm trying to use the same panel that supports both drag, and drop. I've two panels both of them supports drag, and drop. The problem I'm facing is one panel works fine i.e. the dragListener, dropListener methods are called as expected, and updated correctly. On the other panel it is not working the way I expect i.e. dragListener method is called after the dropListener is executed. Here is the code that I'm using

      <rich:panel style="width:133px">
      <f:facet name="header">
      <h:outputText value="Source List" /> </f:facet>
      <h:dataTable id="src" value="#{bean.types}" var="fm" footerClass="footerClass">

      <h:column>
      <a4j:outputPanel style="width:100px;border:1px solid gray;padding:2px" layout="bl
      ock">
      <rich:dragSupport dragIndicator=":indicator"
      dragType="#{fm.type}" dragValue="#{fm}" dragListener="#{bean.processDrag}
      " reRender="src, php, java" >
      <rich:dndParam name="label" value="#{fm.name}" />
      </rich:dragSupport>
      <rich:dropSupport id="phpjava" acceptedTypes="PHP, JAVA" dropValue="PHP"
      dropListener="#{bean.processDropPhpJavaFramework}" reRender="phptable, src">
      </rich:dropSupport>
      <h:outputText value="#{fm.name}"></h:outputText>
      </a4j:outputPanel>
      </h:column>
      <f:facet name="footer">
      <a4j:commandButton action="#{bean.Reset}" value="Start Over" reRender="src"/>
      </f:facet>
      </h:dataTable>
      </rich:panel>
      <rich:panel styleClass="dropTargetPanel">
      <f:facet name="header">
      <h:outputText value="PHP Frameworks" /> </f:facet>
      <rich:dropSupport id="php" acceptedTypes="PHP, JAVA" dropValue="PHP"
      dropListener="#{bean.processDropPhpFramework}" reRender="phptable, src"> </rich:dropSupport>

      <h:dataTable id="phptable" value="#{bean.containerPHP}" var="fm">
      <h:column>
      <a4j:outputPanel style="width:100px;border:1px solid gray;padding:2px" layout="bl
      ock">
      <rich:dragSupport dragIndicator=":indicator"
      dragType="#{fm.type}" dragValue="#{fm}" dragListener="#{bean.processPhpJa
      vaDrag}" reRender="src, phptable" >
      <rich:dndParam name="label" value="#{fm.name}" />
      </rich:dragSupport>
      <h:outputText value="#{fm.name}"></h:outputText>
      </a4j:outputPanel>
      </h:column>

      </h:dataTable>


      </rich:panel>

      In the above example in second <rich:panel> block, if I move the <rich:dropSupport> inside <a4j:outputPanel> none of the listener methods are called, and seems to me the functionality is broken. At least the way it is now I'm able to drag, and drop in both the panels just the listener methods are not being invoked in the correct order. Any help is appreciated.