3 Replies Latest reply on Dec 28, 2008 10:39 AM by Nick Belaevski

    Drag and Drop component

    Yogesh Dabhi Newbie


      is there any functionality like bellow in RF


      there are two panels
      In first there are two components called comp1,comp2

      comp1 from first panel drag and drop to second panel
      and comp1 remains as it is in first panel

      means only clone of comp1 should drop to panel2

      How can i do this?

      Thanks & Regards
      Yogesh N Dabhi

        • 1. Re: Drag and Drop component
          Nick Belaevski Master

          Hi Yogesh,

          Yes, it's possible. Richfaces drag'n'drop doesn't mean moving components in tree; it just calls drag/drop listeners so that you can implement chosen scenario yourself - move/clone/create new/etc.

          • 2. Re: Drag and Drop component
            Yogesh Dabhi Newbie

            have you any example for that so i can implement it

            Thanks abd Regards
            Yogesh N Dabhi

            • 3. Re: Drag and Drop component
              Nick Belaevski Master

              Session-scoped bean:

              package org.richfaces;
              
              import java.util.ArrayList;
              import java.util.List;
              
              import org.richfaces.event.DropEvent;
              
              public class DndDemoBean {
              
               public static class Item {
              
               private String name;
              
               public Item(String name) {
               super();
               this.name = name;
               }
              
               public String getName() {
               return name;
               }
              
               }
              
               private List<Item> items = new ArrayList<Item>();
              
               private Item createItem(String name) {
               return new Item(name);
               }
              
               public void processDrop(DropEvent dropEvent) {
               Item newItem = createItem((String) dropEvent.getDragValue());
              
               items.add(newItem);
               }
              
               public List<Item> getItems() {
               return items;
               }
              
               public String[] getMakers() {
               return new String[]{"Sony", "Dell", "HP"};
               }
              }


              Page code:
              <?xml version="1.0" encoding="ISO-8859-1" ?>
              
              <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0"
               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">
              
              
               <jsp:directive.page contentType="text/html;charset=ISO-8859-1" pageEncoding="ISO-8859-1"/>
               <jsp:output omit-xml-declaration="no"
               doctype-root-element="html"
               doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
               doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/>
              
              
               <f:view>
               <h:form>
               <h:panelGrid columns="2">
               <rich:dataTable value="#{dndDemoBean.makers}" var="maker">
               <h:column>
               <f:facet name="header">
               <f:verbatim>
               Makers choice
               </f:verbatim>
               </f:facet>
              
               <h:outputText value="#{maker}" />
               <rich:dragSupport dragValue="#{maker}" dragType="maker" />
               </h:column>
               </rich:dataTable>
              
               <a4j:outputPanel layout="block" id="makersList">
               <rich:dataTable value="#{dndDemoBean.items}" var="item">
               <h:column>
               <f:facet name="header">
               <f:verbatim>
               Makers list
               </f:verbatim>
               </f:facet>
              
               <h:outputText value="#{item.name}" />
               </h:column>
               </rich:dataTable>
              
               <rich:dropSupport dropListener="#{dndDemoBean.processDrop}" acceptedTypes="maker"
               reRender="makersList"/>
               </a4j:outputPanel>
               </h:panelGrid>
               </h:form>
               </f:view>
              </jsp:root>