p:仪表板添加的面板不可拖动

时间:2015-12-11 11:46:31

标签: jsf primefaces jsf-2.2

我一直在努力遵循这个showcase example。我想要做的是通过点击p:splitButton上的按钮动态地将组件添加到仪表板,向仪表板添加组件工作,但由于某种原因,面板不可拖动。为什么呢?

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>

这就是豆子

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 个答案:

答案 0 :(得分:0)

好了然后让面板可拖动需要设置面板​​标题,所以在addTextWidget方法中我必须做类似的事情

panel.setHeader(widgetId);