jsf - 是否可以为 p:selectOneMenu 设置占位符文本？

Question

我的问题几乎说明了一切。我想在 selectOneMenu 中有一个占位符文本，但我认为没有任何属性可以指定它。那么怎么可能有一个占位符呢？

我尝试使用<p:watermark>如下所示的，但它不起作用。

<p:selectOneMenu id="fooMenu">
    <f:selectItem itemLabel="foo" itemValue="foo"/>
    <f:selectItem itemLabel="goo" itemValue="goo"/>
</p:selectOneMenu>
<p:watermark value="Select" for="fooMenu"></p:watermark>

Answer 1

默认情况下，标准 HTML 元素确实不支持它<select>，因此 JSF 中也没有设置它。

但是，您可以借助一点 CSS 和 jQuery来模拟一个。itemDisabled

<p:selectOneMenu widgetVar="menu" styleClass="with-placeholder" panelStyleClass="hide-disabled" onchange="menu.jq.removeClass('with-placeholder')">
    <f:selectItem itemLabel="Select" itemDisabled="true" />
    <f:selectItem itemLabel="foo" itemValue="foo"/>
    <f:selectItem itemLabel="goo" itemValue="goo"/>
</p:selectOneMenu>

和

.ui-selectonemenu.with-placeholder .ui-selectonemenu-label {
    color: #ccc;
}
.ui-selectonemenu-panel.hide-disabled .ui-selectonemenu-list-item.ui-state-disabled {
    display: none;
}

这是一个视频演示。