两个不同的 h:commandButton 动作的条件渲染

Posted 2023-02-22

【中文标题】两个不同的 h:commandButton 动作的条件渲染

【英文标题】：Conditional rendering of two different h:commandButton actions

【发布时间】：2018-08-25 04:48:39

【问题描述】：

使用的技术：

JSF 2

素颜

问题陈述：

我们有一个下拉列表如下 -

<h:selectOneMenu value ="#bean.value"> 
   <f:ajax event="change" listener="#bean.processValue" 
    render="one,two or panel" />   //render correct id based on approach

   <f:selectItem itemValue = "1" itemLabel = "Item 1" /> 
   <f:selectItem itemValue = "2" itemLabel = "Item 2" />
   <f:selectItem itemValue = "3" itemLabel = "Item 3" /> 
   <f:selectItem itemValue = "4" itemLabel = "Item 4" /> 
</h:selectOneMenu>          

如果用户选择第 2 项，则会显示一个按钮，单击该按钮会打开一个弹出菜单。 如果用户选择项目 1 或 3 或 4 ，则会显示另一个按钮，该按钮在单击时会触发业务操作。

我们能够使用f:ajax 为h:selectOneMenu 获取AJAX 调用。 我们正在使用f:ajax 的render 属性

这工作正常。

问题是如何在 AJAX 响应上设计两个按钮。

不使用 JSTL 的方法：

<h:commandButton id="one" value="Submit" onClick="openPopup" rendered="#bean.render">
<h:commandButton id="two" value="Submit" action="#bean.businessAction" rendered="#bean.render">

#bean.render 将检查单击的项目的值并返回真/假。

使用 JSTL 的方法二：

在同一个 panelGrid 中包装两个按钮并仅渲染 panelGrid。在 panelGrid 中使用 JSTL 来控制渲染。

<h:panelGrid id="panel">
  <c:choose>     
     <c:when test = "$itemVlaue == 2"> // use appropriate EL expression 
       <!-- render command button 1 to open pop up --> 
     </c:when>

     <c:when test = "$itemVlaue == 1 or 3 or 5  "> // use appropriate EL expression 
       <!-- render command button 2 to invoke action --> 
     </c:when>
  </c:choose>
</h:panelGrid>

我在互联网上搜索过，似乎方法一更正确，因为不建议在 JSF 中使用 JSTL 来控制渲染。

但问题是：

当只使用一个命令按钮时，我们最终会创建两个命令按钮。

如果两个命令按钮只需要一个 id 怎么办。这只是一个应该在任何时间点出现的人。

请指教

【问题讨论】：

您的问题确实令人困惑。 标记仅在 JSF 2.0 中引入。但是 JSTL 与 JSF 混合时的问题仅适用于 JSF 1.x。您真正使用的是哪个 JSF 版本？

@Balusc - 我的错误。我已经更新了这个问题。我们只使用 JSF2。这里的要点是渲染组件的最佳方式是什么？使用 JSTL 或 JSF 机制。以及问题中提到的使用 JSF 机制的后果。

【参考方案1】：

您的 Y 问题在以下方面得到解答：

how to refresh jstl test using ajax of primefaces? JSTL in JSF2 Facelets... makes sense? Ajax update/render does not work on a component which has rendered attribute

您的 X 问题回答如下：

<h:selectOneMenu value="#bean.value">
   ...
   <f:ajax listener="#bean.processValue" render="oneAndOnly" />
</h:selectOneMenu>
...
<h:commandButton id="oneAndOnly" value="Submit"
    onclick="#bean.render ? 'openPopup();return false;' : ''"
    action="#bean.businessAction">
</h:commandButton>

换句话说，让它有条件地渲染返回false的onclick属性本身。

【讨论】：

使用相同的命令按钮打开弹出窗口并调用动作是惊人的。我想不出来。再次非常感谢