Question

我已成功使用PrimeFaces selectOneButton - 使用PF 3.5。突然间，它已停止工作，第一个按钮始终无法点击 - 网页代码和支持bean代码（这会影响它）没有变化。

<p:selectOneButton value="#{bean.result}">
                        <f:selectItems value="#{bean.options}" />
                        <p:ajax event="change" process="popupPanel"
                            update="Grid"
                            listener="#{myBackingBean.submitItem(bean.itemId)}" />
                    </p:selectOneButton>

我有一个理论说明为什么第一个按钮不可点击。

来自PrimeFaces SelectOneButton展示：

SelectOneButton是一个输入组件，用于使用常规按钮而不是单选按钮选择选项

因此，SelectOneButton是真正的单选按钮，但显示效果很好;）

现在，带有两个选项的selectOneButton的呈现HTML如下：

<div class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left ui-state-active">
<input id="mainForm:Grid:0:j_idt64:0" name="mainForm:Grid:0:j_idt64" type="radio" value="Yes" class="ui-helper-hidden" checked="checked">
<span class="ui-button-text ui-c">Yes</span>
</div>

<div class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right">
<input id="mainForm:Grid:0:j_idt64:1" name="mainForm:Grid:0:j_idt64" type="radio" value="No" class="ui-helper-hidden">
<span class="ui-button-text ui-c">No</span>
</div>

我注意到两个不同之处...... 1）div类是不同的。 2）第一个选项已检查=“已检查”

1）检查div类的CSS，我看不到任何重要的东西会使按钮不可点击。 2）显然，由于它真的是一个单选按钮，第一个选项是“检查”。

现在，当点击一个普通的标准单选按钮时，你无法点击它以“释放它” - 一旦点击它的单击，就需要点击其他单选按钮来更改选项。

由于我的第一个选项总是“选中”，这会阻止按钮“可点击”吗？有没有其他人经历过类似的事情？环顾四周，我似乎是唯一一个遇到过这个问题的人。

我可以做一些变通办法，但是我无法找出它突然停止工作的原因，宁愿找到解决办法！

感谢任何帮助！

更新

幸运的是，我发现了我以前的webapp旧版本，并检查了呈现的HTML。

下面是第一个按钮的HTML（在我当前版本中无法点击）。

<div class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left">
<input id="mainForm:Grid:0:j_idt63:0" name="mainForm:Grid:0:j_idt63" type="radio" value="Yes" class="ui-helper-hidden">
<span class="ui-button-text ui-c">Yes</span>
</div>

我上面描述的两个差异在我之前的版本中没有呈现 - div类中没有“ui-state-active”，我<input />中没有“checked ='checked'”

我在当前（无法点击）版本上手动编辑了HTML，并删除了“checked ='checked'” - 这没有任何效果。然后我从我的div类中删除了“ui-state-active” - 按钮现在可以点击。

我仍然感到困惑的是为什么HTML现在以不同的方式呈现，我可以改变哪些会导致这种情况发生？

再次感谢。

Answer 1

经过几个小时，我终于找到了原因......

正如我在问题中所说，

SelectOneButton是一个输入组件，用于使用常规选择选项按钮而不是单选按钮

SelectOneButtons是单选按钮。

在同一网页中，我也使用单选按钮作为选项，使用非常相似的代码......

<p:selectOneRadio value="#{bean.result}">
<f:selectItems value="#{bean.options}" />
</p:selectOneRadio>

现在，我遇到了麻烦，当用户看到这些单选按钮时，没有选择任何按钮。这允许用户返回null。现在，我不希望用户能够返回null，因此需要单选按钮 - 一个或另一个。因此，在呈现页面之前，我将#{bean.result}设置为#{bean.options}中的第一个元素，因此当向用户显示按钮时，默认情况下会选择第一个。

因此，当selectOneButton被渲染时，第一个“按钮”被选中，你无法按下它。

p：selectOneButton突然停止工作，第一个按钮不再可点击

1 个答案: