title: Fetch selected value of p:selectOneMenu in JavaScript
body: <p>i need to fetch a value of a <code>&lt;p:selectOneMenu&gt;</code> in javascript but the result that i get is <strong>null</strong>. I am able to call the function but when i am trying to access the value of the <code>&lt;p:selectOneMenu&gt;</code>. i get null in alert box.</p>
  
  <p>Please find the below code.</p>
  
  <pre><code>&lt;p:outputLabel for="year" value="Year: " /&gt; 
          &lt;p:selectOneMenu id="year" style="width:150px   " value="#{someBean.year}"&gt;
          &lt;f:selectItem itemLabel="All" itemValue="All"/&gt;
          &lt;f:selectItem itemLabel="2014" itemValue="2014"/&gt;
          &lt;f:selectItem itemLabel="2013" itemValue="2013"/&gt;
          &lt;f:selectItem itemLabel="2012" itemValue="2012"/&gt;
          &lt;f:selectItem itemLabel="2011" itemValue="2011"/&gt;
          &lt;f:selectItem itemLabel="2010" itemValue="2010"/&gt;
          &lt;f:selectItem itemLabel="2009" itemValue="2009"/&gt;
      &lt;/p:selectOneMenu&gt;
  </code></pre>
  
  <p>Javascript function:</p>
  
  <pre><code>function validateYearMonth()
  {
      var yearValue1=document.getElementById('Form:year_input');
      var yearValue2=document.getElementById('Form:year');
      alert(yearValue1);
      alert(yearValue2);
  
  }
  </code></pre>
  
  <p>Call to function:</p>
  
  <pre><code> &lt;p:commandButton id="Submit" action="#{someBean.functionName}"
      onclick="validateYearMonth()" value="Submit" ajax="false" style="float:right;"&gt;
    &lt;/p:commandButton&gt;
  </code></pre>
  
  <p>I dont understand whats wrong. <strong>while i am able fetch the element</strong> if i am doing</p>
  
  <pre><code>var yearValue1=document.getElementById('Form:year_input');
  </code></pre>
  
  <p>but i am not able to fetch the value. Any help much appreciated.</p>