在JavaScript中获取p：selectOneMenu的选定值

Question

我需要在javascript中获取<p:selectOneMenu>的值，但我得到的结果是 null 。我可以调用该函数但是当我尝试访问<p:selectOneMenu>的值时。我在警告框中得到null。

请找到以下代码。

<p:outputLabel for="year" value="Year: " /> 
        <p:selectOneMenu id="year" style="width:150px   " value="#{someBean.year}">
        <f:selectItem itemLabel="All" itemValue="All"/>
        <f:selectItem itemLabel="2014" itemValue="2014"/>
        <f:selectItem itemLabel="2013" itemValue="2013"/>
        <f:selectItem itemLabel="2012" itemValue="2012"/>
        <f:selectItem itemLabel="2011" itemValue="2011"/>
        <f:selectItem itemLabel="2010" itemValue="2010"/>
        <f:selectItem itemLabel="2009" itemValue="2009"/>
    </p:selectOneMenu>

Javascript功能：

function validateYearMonth()
{
    var yearValue1=document.getElementById('Form:year_input');
    var yearValue2=document.getElementById('Form:year');
    alert(yearValue1);
    alert(yearValue2);

}

致电功能：

 <p:commandButton id="Submit" action="#{someBean.functionName}"
    onclick="validateYearMonth()" value="Submit" ajax="false" style="float:right;">
  </p:commandButton>

我不明白什么是错的。 虽然如果我正在做

，我可以获取元素

var yearValue1=document.getElementById('Form:year_input');

但我无法获取该值。任何帮助非常感谢。

Answer 1

一种非常简单的方法是设置widgetVar名称，然后获取当前值！

<p:selectOneMenu widgetVar="yearWV">

javascript （PF 4及更高版本）

PF('yearWV').value

您可以在控制台中立即测试

Answer 2

你必须在onclick事件中添加return关键字。例如

         <p:commandButton id="Submit" action="#{someBean.functionName}"
          onclick="return validateYearMonth()" value="Submit" ajax="false" style="float:right;">
    </p:commandButton>

Answer 3

在您的JSF表单中，设置prependId = false。即

<h:form id="myform" prependId="false">

如果您没有将prependId设置为false，那么您在生成的HTML下拉列表中获得的内容将是

<select id="myform:year">

在这种情况下，在你的javascript中你必须使用document.getElementById获取元素（＆＃34; myform：year＆＃34;）;

Answer 4

    **BEST WORKING SOLUTION :**

       <p:selectOneMenu id="year" style="width:150px" value="#{someBean.year}" widgetVar="test" onchange="myTestFunction()">
                <f:selectItem itemLabel="All" itemValue="All"/>
                <f:selectItem itemLabel="2014" itemValue="2014"/>
                <f:selectItem itemLabel="2013" itemValue="2013"/>
                <f:selectItem itemLabel="2012" itemValue="2012"/>
                <f:selectItem itemLabel="2011" itemValue="2011"/>
                <f:selectItem itemLabel="2010" itemValue="2010"/>
                <f:selectItem itemLabel="2009" itemValue="2009"/>
            </p:selectOneMenu>

Java Script Code:

function myTestFunction()
        {

        var selectedValue=PF('test').getSelectedValue();

        alert(selectedValue);

        }

    [**For more information please check this link ** https://forum.primefaces.org/viewtopic.php?t=39793][1]