How to make a primefaces breadcrumb dynamic?

Dimitri Dewaele picture Dimitri Dewaele · May 23, 2014 · Viewed 10.9k times · Source

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

Answer

Joffrey Hernandez picture Joffrey Hernandez · May 23, 2014

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}"