在selectOneMenu更改时在同一窗口中打开对话框

Question

我有一个jsf页面，其中有一个selectOneMenu，我想在selectOneMenu更改时打开一个对话框。

例如，如果用户从jsf selectOneMenu中选择值="passive"，则应该在同一页上打开对话框或灯箱，在其中我想显示一个小的jsf表单，就像这里所做的一样。（请单击那个小图像（是的，我想在选择特定值后打开这个对话框） http://www.primefaces.org/showcase-labs/ui/dialogLogin.jsf 我还希望将提交的数据保存在我的后备bean中的某个位置，以便稍后将其存储到数据库中。

我不知道如何在同一个窗口中从后备bean中打开对话框或灯箱，因为我们将使用valueChangeListener事件或使用ajax事件来识别值更改。

我能够确定从selectOneMenu（DropdownMenu）选择了哪个值，但不知道如何在选择特定值时打开对话框。

<h:outputLabel
            value="* Country: "/>
        <h:selectOneMenu
            id="someSelect"
            value="#{testController.countryName}"
            required="true">
            <f:selectItem
                itemLabel="Select Country"
                itemValue=""/>
            <f:selectItems
                value="#{testController.countryNamesSelectItems}"/>
             </h:selectOneMenu>

假设我们在selectItems中有两个选项，即印度和澳大利亚，如果用户选择了印度，则应该在同一页上打开一个对话框，用户需要填写一些信息并提交，如果他来自印度（就像这个例子中http://www.primefaces.org/showcase-labs/ui/dialogLogin.jsf一样（请点击那个小图像（是的，我想在选择特定值后打开这个对话框框）），用户将输入用户名和密码并提交数据。

希望这可以帮助到您。

如何在primefaces中使用java script（jquery）检查selectOneMenu的已选值，就像在richfaces中所做的那样t:selectOneMenu how to get selected value using java script?？

- Java

---

如果有人需要更多的澄清，请告诉我。 - Java

@Matt给我展示了一个好方法。现在在这个阶段，我无法获取selectOneMenu的选定值，我该如何在primefaces中获取它？ - Java

好的，让我们再试一次：在HTML源代码中生成的<select>的ID是什么？找到ID，然后在您的jQuery调用中添加带有转义冒号的完整ID，例如：$('#myform\\:selectedGroupId').val()。 - Matt Handy

嘿，马特，我能够使用这个显示对话框： 如果($("select[name$='someSelect_input'] option:selected").val() == '印度') { dlg.show(); } 感谢完美的指导……它确实帮了我很大的忙。 - Java

很高兴听到它能够工作。我仍然想知道为什么id选择器没有起作用... - Matt Handy

Answer 1

您可以使用 h:selectOneMenu 的 onchange 属性来打开对话框：

 <h:selectOneMenu
        id="someSelect"
        value="#{testController.countryName}"
        required="true"
        onchange="dlg.show()">

使用p:dialog的widgetVar属性来设定对话框的变量名为dlg。这样可以在服务器响应之前打开对话框。

如果你想在ajax请求完成后再打开对话框，可以使用带有oncomplete属性的p:ajax。

<p:ajax update=".." process=".." oncomplete="dlg.show()"/>

如果你想让对话框的打开取决于所选的值，那么你可以使用一个包装函数:

function showDialog() {
 if($('#IdOfYourSelectOneMenu').val() == 'India') {
   dlg.show();
 }
}

使用：

<p:ajax update=".." process=".." oncomplete="showDialog()"/>

- Matt Handy

---

好的，但是如果我使用onchange，那么在选择任何下拉菜单时都会打开对话框，但我只需要在特定值被选中时才打开它。那么我应该怎么做？ - Java

如果您只想在客户端上执行此操作，可以编写一个JavaScript包装函数来调用dlg.show()，该函数首先检查所选值，然后打开对话框。或者注册自己的JavaScript/jQuery事件监听器。 - Matt Handy

是的，确切地说，但我该如何在 JavaScript 中实现，如果选择了特定的值，就打开对话框？ - Java

让我们在聊天中继续这个讨论。 - Java