RichFaces InplaceInput

17 Mar 2025 | 阅读 2 分钟

RichFaces 提供了 <rich:inplaceInput> 组件，用于创建可编辑的文本框。它允许在文本块中内联输入文本。它提高了文本的可读性。

它有三种功能状态

查看状态： 在此状态下，组件显示其初始设置，例如单击以编辑。
编辑状态： 在此状态下，用户可以输入文本。
已更改状态： 在此状态下，已确认组件的新值，但如果需要，可以再次编辑。

样式类和皮肤参数

下表包含 inplaceInput 的样式类和相应的皮肤参数。

Class	函数	皮肤参数	映射的 CSS 属性
.rf-ii	用于定义处于默认状态的就地输入的样式。	editorBackgroundColor	background-color
.rf-ii-act	用于定义处于编辑状态的就地输入的样式。	无皮肤参数。
.rf-ii-chng	用于定义处于已更改状态的就地输入的样式。	无皮肤参数。
.rf-ii-dis	用于定义处于禁用状态的就地输入的样式。	无皮肤参数。
.rf-ii-fld	用于定义就地输入字段的样式。	editBackgroundColor generalTextColor	background-color, border-bottom-color color
.rf-ii-lbl	用于定义就地输入标签的样式。	generalSizeFont	font-size
.rf-ii-dflt-lbl	用于定义就地输入默认标签的样式。	无皮肤参数。
.rf-ii-btn	用于定义就地输入按钮的样式。	tabBackgroundColor	background-color
.rf-ii-btn-p		tabBackgroundColor	background-color
.rf-ii-btn-set, .rf-ii-btn-prepos, .rf-ii-btn-pos	用于定义按钮的位置。	无皮肤参数。
.rf-ii-btn-shdw	用于定义就地输入按钮阴影的样式。	无皮肤参数。
.rf-ii-btn-shdw-t, .rf-ii-btn-shdw-b, .rf-ii-btn-shdw-l, .rf-ii-btn-shdw-r	这些类定义了按钮阴影的顶部、底部、左侧和右侧边缘。	无皮肤参数。
.rf-ii-none	用于定义无法编辑的就地输入的样式。		无皮肤参数。

示例

在这里，在下面的示例中，我们正在实现 <rich:inplaceInput> 组件。此示例包含以下文件。

JSF 文件

// inplace-input.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">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<f:view>
<h:head>
<title>InplaceInput Example</title>
</h:head>
<h:body>
<h:form>
<rich:inplaceInput
value="#{user.name}"
defaultLabel="Enter Your Name"
>
</rich:inplaceInput>
</h:form>
</h:body>
</f:view>
</ui:composition>

托管 Bean

// User.java

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
@ManagedBean
@RequestScoped
public class User {
String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}

输出

现在，输入文本

下一个主题Richfaces <rich:inplaceselect>

← 上一个下一个 →

RichFaces InplaceInput

样式类和皮肤参数

示例

JSF 文件

托管 Bean

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

RichFaces 教程

Ajax 组件

皮肤和主题

UI 组件

面试题

RichFaces InplaceInput

样式类和皮肤参数

示例

JSF 文件

托管 Bean

相关帖子

rich:orderingList

rich:inputNumberSpinner

rich:message

rich:messages

rich:dataTable

rich:notifyStack

rich:list

rich:dataGrid

rich:dataScroller

rich:tooltip

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器