PrimeFaces工具栏用法

本文概述

  • 工具栏属性
  • 例子
它是一个水平分组组件, 用于与命令和其他内容一起组成工具栏。 PrimeFaces提供了< p:toolbar> 组件, 用于在JSF应用程序中创建工具栏。创建基于工具的Web应用程序很有用。它还具有下表列出的各种属性。
工具栏属性
Attribute Default value Type Description
id null String 它是组件的唯一标识符。
rendered true Boolean 它用于指定组件的呈现。
binding null Object El表达式, 它映射到支持Bean中的服务器端UIComponent实例
style null String 用于设置容器元素的内联样式。
styleClass null String 用于设置容器的样式类。元件。
例子 在下面的示例中, 我们正在实现< p:toolbar> 组件。本示例包含以下文件。
JSF文件
// toolBar.xhtml
< ?xml version='1.0' encoding='UTF-8' ?> < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> < html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://xmlns.jcp.org/jsf/html"xmlns:p="http://primefaces.org/ui"xmlns:f="http://xmlns.jcp.org/jsf/core"> < h:head> < title> ToolBar< /title> < /h:head> < h:body> < h:form> < p:growl id="messages" showDetail="true" /> < p:toolbar> < f:facet name="left"> < p:commandButton type="button" value="http://www.srcmini.com/New" icon="ui-icon-document" /> < p:commandButton type="button" value="http://www.srcmini.com/Open" icon="ui-icon-folder-open" /> < span class="ui-separator"> < span class="ui-icon ui-icon-grip-dotted-vertical" /> < /span> < p:commandButton type="button" title="Save" icon="ui-icon-disk" /> < p:commandButton type="button" title="Delete" icon="ui-icon-trash" /> < p:commandButton type="button" title="Print" icon="ui-icon-print" /> < /f:facet> < f:facet name="right"> < p:menuButton value="http://www.srcmini.com/Options"> < p:menuitem value="http://www.srcmini.com/Save" actionListener="#{toolbar.save}" update="messages" icon="ui-icon-disk" /> < p:menuitem value="http://www.srcmini.com/Update" actionListener="#{toolbar.update}" update="messages" icon="ui-icon-arrowrefresh-1-w" /> < p:menuitem value="http://www.srcmini.com/Delete" actionListener="#{toolbar.delete}" ajax="false" icon="ui-icon-close" /> < p:menuitem value="http://www.srcmini.com/Homepage" url="http://www.srcmini.com" icon="ui-icon-extlink" /> < /p:menuButton> < /f:facet> < /p:toolbar> < /h:form> < /h:body> < /html>

ManagedBean
// ToolBar.java
package com.srcmini; import javax.faces.application.FacesMessage; import javax.faces.bean.ManagedBean; import javax.faces.context.FacesContext; @ManagedBeanpublic class ToolBar {public void save() {addMessage("Success", "Data saved"); }public void update() {addMessage("Success", "Data updated"); }public void delete() {addMessage("Success", "Data deleted"); }public void addMessage(String summary, String detail) {FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, summary, detail); FacesContext.getCurrentInstance().addMessage(null, message); }}

【PrimeFaces工具栏用法】输出
PrimeFaces工具栏用法

文章图片

    推荐阅读