如何处理JSF中bean文件中任何组件的drop?

时间:2013-12-03 11:50:20

标签: jsf jsf-2 primefaces

我正在使用Primefaces及其可拖动和可拖放的标签。它使组件可拖动和可拖放。我调用ajax监听器来处理丢弃。我想将组件从layoutUnit拖动到面板。我能够拖动而不是掉落。我有不同的UIComponents(例如:outputLabel,inputText,radioButtons,images等)。但实际上我不知道如何处理某个面板的拖放组件。 有人帮助我吗?有什么想法吗?

编辑:

这是我的xhtml:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html">
        <h:head>

        </h:head>

        <h:body>

            <p:layout fullPage="true">
                <p:layoutUnit id="top" position="north" header="menu" size="100">

                </p:layoutUnit>

                <p:layoutUnit id="bottom" position="south" header="properties" size="100">

                </p:layoutUnit>

                <p:layoutUnit id="left" position="west" header="toolbox" size="200" >
                    <p:outputLabel id="out1" value="outputlabel"/>
                    <p:draggable for="out1" helper="clone"/>
                </p:layoutUnit>


                <p:layoutUnit id="middle" position="center" header="sayfa 1" >
                    <p:tabView style="height: 650px;">
                        <p:tab id="drop_page_1" title="Page 1">
                            <p:panel rendered="#{empty myBean.components}" id="panel1" style="height: 500px;">
                                Please drag any component to here.
                            </p:panel>
                            <p:panel  id="tab_panel" rendered="#{not empty myBean.components}" style="height: 500px;">

                            </p:panel>
                            <p:droppable for="panel1" datasource="left" onDrop="handleDrop()">
                                <p:ajax listener="#{myBean.f_onCompDrop}" update="drop_page_1"/>
                            </p:droppable>
                        </p:tab>
                        <p:tab id="drop_page_2" title="+" />
                        <p:droppable for="drop_page_1">
                            <p:ajax listener="#{myBean.f_onCompDrop}" update="drop_page_1" />
                        </p:droppable>

                    </p:tabView>


                </p:layoutUnit>
                <p:droppable for="middle" >
                    <p:ajax listener="#{myBean.f_onCompDrop}" />
                </p:droppable>
            </p:layout>

        </h:body>
    </f:view>
</html>

这是我的bean文件:

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import org.primefaces.event.DragDropEvent;
import java.util.List;
import javax.faces.component.UIComponent;

@ManagedBean(name="myBean")
@SessionScoped
public class NewJSFManagedBean {

    private List<UIComponent> components;
    public NewJSFManagedBean() {
    }
    public void f_onCompDrop(DragDropEvent ddEvent) {  
        UIComponent comp = ddEvent.getComponent().findComponent(ddEvent.getDragId());

        components.add(comp);  
    }

    public List<UIComponent> getComponents() {
        return components;
    }

    public void setComponents(List<UIComponent> components) {
        this.components = components;
    }
}

0 个答案:

没有答案