 <p>JavaScript knows <em>nothing</em> about the JSF code. Instead it knows everything about its generated HTML output. Look at the generated HTML output by rightclick page in browser and <em>View Source</em>. If you look closely, you'll see that the <code>&lt;p:selectOneMenu&gt;</code> doesn't generate a <code>&lt;select&gt;&lt;option&gt;</code>, it instead generates a <code>&lt;div&gt;&lt;ul&gt;&lt;li&gt;</code>. The <code>disabled</code> attribute is only supported on <code>&lt;select&gt;</code>. Hence you don't see any effect.</p> <p>I suggest you to disable the thing via JSF ajax instead of via JavaScript. It's a matter of adding a <code>&lt;f:ajax&gt;</code> or <code>&lt;p:ajax&gt;</code> inside the dropdown and specifying the IDs of components which needs to be updated wherein the <code>disabled</code> check is been done based on the currently selected item. No need for JavaScript boilerplate anymore. This way you'll also take advantage of the robustness of server side validation.</p> <pre><code>&lt;p:selectOneMenu binding="#{searchType}" ...&gt; &lt;f:selectItem itemLabel="Search By Skill" itemValue="1" /&gt; &lt;f:selectItem itemLabel="Search By Location" itemValue="2" /&gt; &lt;p:ajax update="search type1" /&gt; &lt;/p:selectOneMenu&gt; &lt;p:inputText id="search" ... disabled="#{searchType.value == 2}" /&gt; &lt;p:selectOneMenu id="type1" ... disabled="#{searchType.value == 1}"&gt; ... &lt;/p:selectOneMenu&gt; </code></pre> <hr> <p>By the way, the variable name "combo" is wrong. It's a dropdown, not a combobox. A combobox is an <strong>editable</strong> dropdown. The <code>&lt;p:selectOneMenu&gt;</code> doesn't render an editable dropdown, but just a dropdown.</p>