p:dashboard added panels aren't draggable

问题

I have been trying to follow this showcase example. What I want to do is dynamically add components to a dashboard by clicking buttons on a p:splitButton, the adding of components to the dashboard works, but the panels aren't draggable for some reason. Why?

The XHTML

<!DOCTYPE html>
<html xmlns="http://www.w3c.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:p="http://primefaces.org/ui">
<h:head>
    <title>Example</title>
</h:head>
<h:body>
    <h:form id="splitButtonForm">
        <p:splitButton value="Action" icon="ui-icon-circle-triangle-s">
            <p:menuitem value="New text entry" icon="ui-icon-newwin"
                actionListener="#{dashboardView.addTextWidget}"
                update="dashboardForm:dashboardPanel" />
        </p:splitButton>
    </h:form>

    <h:form id="dashboardForm">
        <p:dashboard id="dashboardPanel" model="#{dashboardView.model}">
            <p:ajax event="reorder" listener="#{dashboardView.handleReorder}"/>
        </p:dashboard>
    </h:form>
</h:body>
</html>

And here's the bean

import java.io.Serializable;

import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;

import org.primefaces.component.inputtext.InputText;
import org.primefaces.component.panel.Panel;
import org.primefaces.event.DashboardReorderEvent;
import org.primefaces.model.DashboardColumn;
import org.primefaces.model.DashboardModel;
import org.primefaces.model.DefaultDashboardColumn;
import org.primefaces.model.DefaultDashboardModel;

@SuppressWarnings("serial")
@ManagedBean
@ViewScoped
public class DashboardView implements Serializable
{

    private DashboardModel model;

    public DashboardModel getModel()
    {
        return model;
    }

    @PostConstruct
    public void init()
    {
        model = new DefaultDashboardModel();
        DashboardColumn column1 = new DefaultDashboardColumn();
        DashboardColumn column2 = new DefaultDashboardColumn();

        model.addColumn(column1);
        model.addColumn(column2);
    }

    public void addWidget(String widgetId)
    {
        DashboardColumn column1 = model.getColumn(0);
        column1.addWidget(widgetId);
    }

    public void addTextWidget(ActionEvent event)
    {
        UIComponent dashboardPanel = FacesContext.getCurrentInstance().getViewRoot().findComponent("dashboardForm:dashboardPanel");

        Panel panel = new Panel();

        InputText textWidget = new InputText();

        int childCount = dashboardPanel.getChildCount();

        String widgetId = "widget" + String.valueOf(childCount);

        panel.setId(widgetId);
        panel.getChildren().add(textWidget);

        addWidget(widgetId);

        dashboardPanel.getChildren().add(panel);
    }

    public void handleReorder(DashboardReorderEvent event)
    {

    }

}

回答1:

OK then to make the panels draggable the panels header needs to be set, so in the addTextWidget method I had to do something like

panel.setHeader(widgetId);

来源：https://stackoverflow.com/questions/34222815/pdashboard-added-panels-arent-draggable

标签

jsf

primefaces

jsf-2.2