srcmini本文概述
它是带有滑块的文本输入。它用于在滑块的帮助下获得用户输入。它允许我们使用滑块增加和减少输入。 <p：slider>组件用于创建滑块输入文本。它还具有下表列出的各种属性。
滑块属性
| Attribute | Default value | Type | Description |
|---|---|---|---|
| minValue | 0 | Integer | 用于设置滑块的最小值。 |
| maxValue | 100 | Integer | 用于设置滑块的最大值。 |
| style | null | String | 它用于设置容器元素的内联CSS。 |
| animate | true | Boolean | 它需要布尔值来设置启用或禁用动画功能。 |
| type | horizontal | String | 用于设置滑块的类型。无论是水平还是垂直。 |
| step | 1 | Integer | 用于设置滑块的步骤。 |
| disabled | 0 | Boolean | 用于禁用滑块。它需要布尔值。 |
| onSlideStart | null | String | 它用于在滑块启动事件上调用客户端脚本。 |
| onSlideEnd | null | String | 它在幻灯片末尾执行客户端脚本。 |
| range | false | Boolean | 它用于提供范围。 |
| displayTemplate | null | String | 这是一个字符串模板。 |
例子
在下面的示例中, 我们正在实现<p：slider>组件。本示例包含以下文件。
JSF文件
// slide.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">
<h:head>
<title>Input Slider</title>
</h:head>
<h:body>
<h:form>
<p:growl id="growl" showDetail="true" />
<h3 style="margin-top: 0">PrimeFaces InputText Slider</h3>
<h:panelGrid columns="1" style="margin-bottom: 10px">
<p:inputText id="user-name" value="#{slider.value}" />
<p:slider for="user-name" />
</h:panelGrid>
<br/>
<p:commandButton value="Submit" />
</h:form>
</h:body>
</html>ManagedBean
// Slider.java
package com.srcmini;
import javax.faces.bean.ManagedBean;
@ManagedBean
public class Slider {
private int value;
public int getValue() {
return value;
}
public void setValue(int value) {
this.value = value;
}
}输出
评论前必须登录！
注册