How to make a primefaces breadcrumb dynamic?

问题

I'm using primefaces and want to add a breadcrumb menu. How should I load my breadcrumb dynamically? What advise or experience do you have?

<p:breadCrumb>
    <p:menuitem value="Categories" url="#" />
    <p:menuitem value="Sports" url="#" />
    <p:menuitem value="Basketball" url="#" />
    <p:menuitem value="NBA" url="#" />
    <p:menuitem value="Teams" url="#" />
    <p:menuitem value="L.A. Lakers" url="#" />
    <p:menuitem value="Roster" url="#" />
    <p:menuitem value="Kobe Bryant" url="#" />
</p:breadCrumb>

Documentation to primefaces

回答1:

BreadCrumb as a model in attribute. This one serves to create menuitem dynamically like this example for MenuBar from Primefaces Documentation (Of course, you have to adapt this one for BreadCrumb):

public class MenuBean {
    private MenuModel model;

    public MenuBean() {
        model = new DefaultMenuModel();
        // First submenu
        DefaultSubMenu firstSubmenu = new DefaultSubMenu("Dynamic Submenu");
        DefaultMenuItem item = new DefaultMenuItem("External");
        item.setUrl("http://www.primefaces.org");
        item.setIcon("ui-icon-home");
        firstSubmenu.addElement(item);
        model.addElement(firstSubmenu);
        // Second submenu
        DefaultSubMenu secondSubmenu = new DefaultSubMenu("Dynamic Actions");
        item = new DefaultMenuItem("Save");
        item.setIcon("ui-icon-disk");
        item.setCommand("#{menuBean.save}");
        item.setUpdate("messages");
        secondSubmenu.addElement(item);
        item = new DefaultMenuItem("Delete");
        item.setIcon("ui-icon-close");
        item.setCommand("#{menuBean.delete}");
        item.setAjax(false);
        secondSubmenu.addElement(item);
        item = new DefaultMenuItem("Redirect");
        item.setIcon("ui-icon-search");
        item.setCommand("#{menuBean.redirect}");
        secondSubmenu.addElement(item);
        model.addElement(secondSubmenu);
    }

    public MenuModel getModel() {
        return model;
    }
}

After this you have just to call the model like this inside your breadcrumb :

model="#{menuBean.model}"

回答2:

A very lean example of a dynamic breadcrumb implementation would be:

<h:form>        
    <p:breadCrumb model="#{breadcrumbVO.menuModel}">
    </p:breadCrumb>
</h:form>

And the backing model would look like:

import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

import org.primefaces.model.menu.DefaultMenuItem;
import org.primefaces.model.menu.DefaultMenuModel;
import org.primefaces.model.menu.MenuModel;

@ManagedBean
@ViewScoped
public class BreadcrumbVO {         

    private MenuModel menuModel;

    public BreadcrumbVO() {
        menuModel = new DefaultMenuModel();
        DefaultMenuItem menuItem = new DefaultMenuItem();
        menuItem.setValue("Test Value");
        //you can add multiple elements in a similar fashion.
        //for simplicity I have added just one
        menuModel.addElement(menuItem);         
    }

    public MenuModel getMenuModel() {
        return menuModel;
    }

    public void setMenuModel(MenuModel menuModel) {
        this.menuModel = menuModel;
    }       
}

来源：https://stackoverflow.com/questions/23828507/how-to-make-a-primefaces-breadcrumb-dynamic

标签

jsf

dynamic

primefaces

breadcrumbs