Question

When I place an InputTextArea and a SelectManyMenu (in that order) in a page, I can't select any items in the menu - nothing is highlighted when I click on them. However, if I change the order on the page (SelectManyMenu before the InputTextArea), then everything works as it's supposed to.

This works:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
<h:head/>
<body>
<h:form>

    <p:selectManyMenu id="testSMM">
        <f:selectItem itemLabel="Option 1" itemValue="1"/>
        <f:selectItem itemLabel="Option 2" itemValue="2"/>
        <f:selectItem itemLabel="Option 3" itemValue="3"/>
    </p:selectManyMenu>
    <br/>
    <p:inputTextarea id="testITA"/>

</h:form>
</body>
</html>

This doesn't:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
<h:head/>
<body>
<h:form>

    <p:inputTextarea id="testITA"/>
    <br/>
    <p:selectManyMenu id="testSMM">
        <f:selectItem itemLabel="Option 1" itemValue="1"/>
        <f:selectItem itemLabel="Option 2" itemValue="2"/>
        <f:selectItem itemLabel="Option 3" itemValue="3"/>
    </p:selectManyMenu>

</h:form>
</body>
</html>

All I did was put one tag before the other. What am I missing here?

ps: This doesn't happen with an InputText.

EDIT:

The browser console says Uncaught ReferenceError: PrimeFaces is not defined at components.js.xhtml?ln=primefaces&v=6.0:1, and even though the generated html has the same content (but not in the same order, obviously), the InputTextArea has different attributes when I check the 'elements' tab in the console:

working code:

<textarea id="j_idt4:testITA" name="j_idt4:testITA" cols="20" rows="3"
maxlength="2147483647" class="ui-inputfield ui-inputtextarea ui-widget ui-state-default ui-corner-all ui-inputtextarea-resizable"
role="textbox" aria-disabled="false" aria-readonly="false" aria-multiline="true"
data-autosize-on="true" style="overflow: hidden; overflow-wrap: break-word; height: 63px;"
</textarea>

buggy code:

<textarea id="j_idt4:testITA" name="j_idt4:testITA" cols="20" rows="3"
maxlength="2147483647" class="ui-inputfield ui-inputtextarea ui-widget ui-state-default ui-corner-all ui-inputtextarea-resizable"
</textarea>

Answer 1

PrimeFaces 6.0在这方面存在一些小问题，与未加载正确的核心javascript的组件有关。这些已在6.0.x精英版和6.1社区版中修复。

SelectManyMenu - can't select item when after InputTextArea

1 个答案:

SelectManyMenu - can&#39;t select item when after InputTextArea

1 个答案:

SelectManyMenu - can't select item when after InputTextArea