个性化阅读
专注于IT技术分析

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="New" icon="ui-icon-document" />
<p:commandButton type="button" value="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="Options">
<p:menuitem value="Save" actionListener="#{toolbar.save}" update="messages" icon="ui-icon-disk" />
<p:menuitem value="Update" actionListener="#{toolbar.update}" update="messages" icon="ui-icon-arrowrefresh-1-w" />
<p:menuitem value="Delete" actionListener="#{toolbar.delete}" ajax="false" icon="ui-icon-close" />
<p:menuitem value="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;
@ManagedBean
public 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 CommandLink 1
赞(0) 打赏
未经允许不得转载:srcmini » PrimeFaces工具栏用法
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏