简体   繁体   中英

p:ajax listener doesn't work in primefaces

I want to drag items and drop it into dashboard. I can take the outputLabel component which is draggable but I can't drop it into dashboard. In droppable tag for dashboard, p:ajax listener elements doesn't work. How can I fix it? or Where is my mistake? Can anyone help me?

Here is my bean function:

public void f_onCompDrop(DragDropEvent ddEvent) {
        FacesContext fc = FacesContext.getCurrentInstance();
        Application application = fc.getApplication();
        dashboard = (Dashboard) application.createComponent(fc, "org.primefaces.component.Dashboard",
                "org.primefaces.component.DashboardRenderer");
        UIComponent comp = ddEvent.getComponent().findComponent(ddEvent.getDragId()); 
        dashboard.setId(ddEvent.getDropId());
        getDashboardComponents();
        DashboardModel model = new DefaultDashboardModel();
        for (int i = 0; i < 3; i++) {
            DashboardColumn column = new DefaultDashboardColumn();
            model.addColumn(column);

        }
        dashboard.setModel(model); 
        if (comp.getId().startsWith("out", 0)) { 
            OutputTextBean out = new OutputTextBean();
            OutputLabel outputLbl = new OutputLabel();
            outputLbl.setId("out_" + out.getID());
            outputLbl.setValue("Dragged");
            model.getColumn(0).addWidget(outputLbl.getId());
        }

        components.add(comp);
    }

Here is my xhtml file:

<!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>
            <style type="text/css">
                .ui-widget {
                    font-size: 75%;
                }
                .ui-layout-west {
                    z-index:20 !important;
                    overflow:visible;
                }
                .ui-layout-west .ui-layout-unit-content {
                    overflow:visible;
                }
            </style>
        </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="out_1" value="outputlabel"/>
                    <p:draggable for="out_1" helper="clone"/>
                </p:layoutUnit>

                <p:layoutUnit id="middle" position="center" >
                    <p:tabView>
                        <p:tab title="Page 1">
                            <p:dashboard id="dashboard" binding="#{myBean.dashboard}" style="width: 600px; height: 600px;">
                            </p:dashboard>

                            <p:droppable for="dashboard" >
                                <p:ajax listener="#{myBean.f_onCompDrop}" update="dashboard"/>
                            </p:droppable>
                        </p:tab>
                    </p:tabView>
                </p:layoutUnit>

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

The mistake is that you forgot the form. Add <h:form> after the body's opening tag, and </h:form> before body's closing tag.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM