如何在JSF中的特定按钮上单独创建组件？

Posted 2021-03-30

<h:panelGroup rendered="#{spkrCatEvt.createPanel}">
    <label>Event Name</label>
    <h:selectOneMenu style="width: 250px" class="form-control" value="#{spkrCatEvt.selected.evtId}" id="speaker_eve">
        <f:selectItems value="#{spkrCatEvt.eventlist}" var="sl" itemLabel="#{sl.value}" itemValue="#{sl.id}"/>
    </h:selectOneMenu>
    <label>Speaker Name</label>
    <h:selectOneMenu style="width: 250px" class="form-control" value="#{spkrCatEvt.selected.spkrId}" id="speaker">
        <f:selectItems value="#{spkrCatEvt.speakerlist}" var="sl" itemLabel="#{sl.value}" itemValue="#{sl.id}"/>
    </h:selectOneMenu>
</h:panelGroup>

上面是我的JSF表单中编写的代码部分，当我单击“添加”按钮时会显示该代码。在相同的形式，我也编写了表格的代码，以显示如下数据：

<table id="example" class="table table-bordered table-striped">
    <thead>
        <tr>
            <th>Speaker Name</th>
            <th>Event Name</th>
        </tr>
    </thead>

    <tbody>
        <ui:repeat id="dataTbl" value="#{spkrCatEvt.items}" var="item">
            <tr>
                <td><h:outputText value="#{item.spkrName}"/></td>
                <td><h:outputText value="#{item.evtName}"/></td>

                <td>
                    <h:commandLink action="#{spkrCatEvt.prepareView()}" id="view" title="View"><i class="fa fa-th-large"/></h:commandLink>
                    <h:outputText value="  "/>
                    <h:commandLink  action="#{spkrCatEvt.prepareEdit()}" id="edit" title="Edit"><i class="fa fa-edit"></i></h:commandLink>
                    <h:outputText value=" "/>
                    <h:commandLink  action="#{spkrCatEvt.activeEdit()}" id="activate" title="Activate" rendered="#{!item.active}"><i class="fa fa-check"></i></h:commandLink>
                    <h:commandLink  action="#{spkrCatEvt.activeEdit()}" id="deactivate" title="DeActivate" rendered="#{item.active}"><i class="fa fa-times"></i></h:commandLink>
                </td>
            </tr>
        </ui:repeat>
    </tbody>
</table>

当我点击表格中的更新按钮时，我想让<h:selectOneNenu> readonly显示“事件名称”。

我通过给元素赋予渲染属性来尝试相同但它不起作用。

作为JSF的初学者，我没有得到解决方案。

我将不得不寻求帮助。

答案

在disabled上使用rendered而不是h:selectOneMenu; rendered是为了省略它们。将它绑定到bean上的布尔值，单击按钮时将其设置为true。所以像

<h:selectOneMenu ... disabled="#{spkrCatEvt.oneMenuDisabled}"/>

记住bean上的getter / setter。

如果您不喜欢新的灰色外观，您可以使用例如样式

select:disabled{
    color: black;
}

如果它本来是一个主要的selectOneMenu

.ui-selectonemenu.ui-state-disabled{
     opacity: 1; // Between 0.0 and 1, 0.35 being default
}