PrimeFaces Inplace

17 Mar 2025 | 阅读 2 分钟

它是一个输入文本框，提供在浏览器上轻松编辑值的功能。它由两个成员组成，显示元素是初始可点击标签，内联元素是在切换显示元素时显示的隐藏内容。

PrimeFaces 提供 <p:inplace> 组件，用于在 JSF 应用程序中创建 inplace。它具有以下表格中列出的各种属性。

Inplace 属性

属性	默认值	类型	描述
label	null	String	它用于设置要在显示模式下显示的标签。
emptyLabel	null	String	它用于设置当值为空时要在显示模式下显示的标签。
效果	fade	String	它用于设置切换时要使用的效果。
effectSpeed	正常	String	它是效果的速度。
disabled	false	Boolean	它阻止显示隐藏的内容。
style	null	String	它用于设置主容器元素的内联样式。
editor	false	Boolean	它指定编辑器模式。
saveLabel	保存	String	它用于设置编辑器模式下保存按钮的工具提示文本。
cancelLabel	Cancel (取消)	String	它用于设置编辑器模式下取消按钮的工具提示文本。
event	点击	String	它用于设置客户端事件的名称以显示内联内容。
toggleable	true	Boolean	它定义了 inplace 是否可切换。

示例

在此，在以下示例中，我们正在实现 <p:inplace> 组件。此示例包含以下文件。

JSF 文件

// inplace.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>Inplace</title>
</h:head>
<h:body>
<h:form>
<h:panelGrid columns="2" columnClasses="column" cellpadding="5">
<h:outputLabel value="User Name:" />
<p:inplace>
<p:inputText value="Roshan" />
</p:inplace>
</h:panelGrid>
</h:form>
</h:body>
</html>

输出