如何在Primefaces CommandButton重置类型上重置下拉菜单 [英] How to reset dropdown on primefaces commandButton reset type

问题描述

如何在类型重置时按p:commandButton来重置p:selectOneMenu的值.我的代码如下

How to reset the value of p:selectOneMenu on pressing p:commandButton on type reset. The code i have is as follows

<h:form id="form">

    <p:panelGrid columns="2" cellspacing="10" >
    <f:facet name="header">Login</f:facet>
    <p:outputLabel value="Username" />
    <p:inputText value="#{user.username}" />
    <p:outputLabel value="Password" />
    <p:password value="#{user.password}"></p:password>

    <p:outputLabel value="Locale" />
    <p:selectOneMenu >
    <f:selectItem itemValue="Select Country" itemLabel="Select Country" />
    <f:selectItem itemValue="Poland" itemLabel="Poland"/>
    </p:selectOneMenu>
    <p:commandButton value="Submit"></p:commandButton>
    <p:commandButton type="reset" value="Clear" update="form"></p:commandButton>
    </p:panelGrid>

</h:form>

这样做，将清除用户名和密码，但不会重置所选国家/地区的下拉菜单.

On doing so, the username and password get cleared but the dropdown for select country is not reset.

推荐答案

首先，您只显示p:selectOneMenu中的值，但不分配这些值，value属性表示可以从客户端分配当前选择的值一侧进入支持bean的值，所以；

First you are just showing the values in your p:selectOneMenu but not assigning those values, value property stands to be able to assign currently selected value from client side into the backing bean value, so;

<p:selectOneMenu id="myMenu" value="#{bean.selectedCountry}">
    <f:selectItem itemValue="Select Country" itemLabel="Select Country" />
    <f:selectItem itemValue="Poland" itemLabel="Poland"/>
</p:selectOneMenu>

现在，如果用户选择波兰作为国家/地区，它将在后备bean上设置为selectedCountry，也不要忘记实现getter和setter方法.

Now if user selects Poland as country it will be setted as selectedCountry on the backing bean also do not forget to implement getter and setter methods.

然后，如果您想重置组件的值，p:selectOneMenu会生成一个标签，并更改其文本可以在视图上完成操作:

Then if you want to reset the value of the component, p:selectOneMenu generates a label and changing it's text can do the trick on view:

<p:commandButton onclick="resetter();" type="reset" value="Clear" update="form"></p:commandButton>

还有js函数:

function resetter() {
    document.getElementById('form:myMenu_label').innerHTML = 'Select Country';
}

这篇关于如何在Primefaces CommandButton重置类型上重置下拉菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！