drag and drop support

[mpelaez]

somebady have an example of drag and drop support that works fine??

[nbelaevski]

Hi,

First of all, there are working examples at livedemo & photoalbum applications. You can checkout both from SVN.

[mpelaez]

I mean a little example with backing bean...a basic example.

[mpelaez]

I have the livedemo but I can not see the backing bean...I have no experience working with this tecnology...i am learning right now and it is kind of difficult. I"d like an example more simple than the example in livedemo or at least if you can tell me how can I see the bean in the demo i would very helpfull..

[mpelaez]

well, i did not have the livedemo fisically but now i have it..

[ilya_shaikovsky]

info about demos downloads and sources here http://www.jboss.org/richfaces/demos.html

[mpelaez]

ok, thanks

[mpelaez]

Hi, take a look on this...I tried to do this little example but does not work at all (I mean at all...nothing)...Can you tell me what I am doing wrong??

XHTML page:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

    <rich:dragIndicator id="indicator" />      

    <h:form id="form">

    <h:panelGrid columns="3" width="100%">

       <rich:panel id=”panel1”>

        <f:facet name="header"> <h:outputText value="Drag Zone" /></f:facet>

        <h:dataTable id="tableSource" columns="1" value="#{jodete.sourceList}" var="item">    

         <h:column>

            <a4j:outputPanel layout="block" style="width:100px;border:1px solid gray;padding:2px">

             <rich:dragSupport dragIndicator=":indicator" dragType="type" dragValue="#{item}" >

                <a4j:actionparam name="source" value="#{item}"/>

               <rich:dndParam name="label" value="#{item}"/>

             </rich:dragSupport> 

             <h:outputText value="#{item}" />

           </a4j:outputPanel>

         </h:column>             

        </h:dataTable>      

       </rich:panel>

       <rich:panel id=”panel2”>

         <f:facet name="header"><h:outputText value="Drop Zone" /></f:facet>

          <rich:dropSupport id="target" acceptedTypes="type" dropValue="#{item}" dropListener="#{jodete.processDrop}" reRender="tableTarget"

          typeMapping="{type:text_accept}">

           <rich:dndParam name="text_accept" value="Accepted..."/>

          </rich:dropSupport>

        </rich:panel>

        <rich:panel id=”panel3”>

           <f:facet name="header"><h:outputText value="Selected Items" /></f:facet>

           <h:dataTable id="tableTarget" columns="1" value="#{jodete.targetList}" var="tr">

             <h:column>

               <h:outputText value="#{tr}" />

             </h:column>

            </h:dataTable>

         </rich:panel>     

      </h:panelGrid>              

    </h:form>

    <a4j:outputPanel ajaxRendered="true">

        <h:messages></h:messages>

    </a4j:outputPanel>

</ui:composition>

Bean:

import java.util.ArrayList;

import java.util.List;

import javax.faces.context.FacesContext;

import org.jboss.seam.Component;

import org.jboss.seam.ScopeType;

import org.jboss.seam.annotations.Begin;

import org.jboss.seam.annotations.Create;

import org.jboss.seam.annotations.End;

import org.jboss.seam.annotations.Name;

import org.jboss.seam.annotations.Scope;

import org.richfaces.event.DropEvent;

import org.richfaces.event.DropListener;

import javax.faces.component.UIComponent;

@Name ("jodete")

@Scope(ScopeType.CONVERSATION)

public class Jodete implements DropListener {

            private List<String> sourceList;

            private List<String> targetList;

            @Begin(join=true)

            @Create       

            public void InitJodete(){

                        sourceList=new ArrayList<String>();

                        targetList=new ArrayList<String>();             

                        sourceList.add("aaa");

                        sourceList.add("bbb");

                        sourceList.add("ccc");                      

            }

            public List<String> getSourceList() {

                        return sourceList;

            }

            public void setSourceList(List<String> sourceList) {

                        this.sourceList = sourceList;           

            }

            public void setTargetList(List<String> targetList) {

                        this.targetList = targetList;

            }

            public List<String> getTargetList() {

                        return targetList;

            }

            public void processDrop(DropEvent event) {                                                         

                        FacesContext context=FacesContext.getCurrentInstance();

                        String   a=context.getExternalContext().getRequestParameterMap().get("source").toString();

                        targetList.add(a);

            }

}

[ilya_shaikovsky]

Your page not using composition teamplate and so seems used just standalone? then at first it do not have html-head-body definitions. So you have just not valid page.

[mpelaez]

ok, huge mistake...I copied and pasted and i did not realize that the page was not valid...I will be more carefull the next time..

Thanks a lot for your help...