malformedXML: During update: outerTab:j_idt185 not found; iframe id=“JSFFrameId”

Question

I have a form with a PrimeFaces selectOneMenu which, when the user selects an option, I want to refresh a DataTable in the same form with different data. When I select an option I get a Javascript popup that says "malformedXML: During update: outerTab:j_idt185 not found" with no DataTable refresh and on inspecting the source I see an invisible iframe at the bottom of the page with id="JSFFrameId" that contains an element <partial-response> that in turn contains an element <update id="outerTab:j_idt185" ...> and this contains an element <![CDATA[<div id="outerTab:j_idt185" class="ui-messages ui-widget" aria-live="polite"></div>]]> . I think this references my <messages> tag, but nothing in the backing bean creates a message, and I do see an element in the page source <div id="outerTab:facilitatorTestsForm:j_idt113" class="ui-messages ui-widget" aria-live="polite"></div> where the messages should be, so the messages tag is indeed rendered. I can find no element with an ID containing "j_idt185" and apparently neither can some Javascript.

The "outerTab" in the IDs is a PrimeFaces TabView that contains all this stuff.

A page refresh causes the update to happen and the DataTable shows the correct data for the selected SelectOneMenu option.

I have found several posts by balusC where some element that is updated by an ajax call has a rendered value that makes it not render and therefore unable to be found when the update is called for. The target of my update (the DataTable) has no rendered attribute and is visible all the time, so this is a different problem. Other posts speak to a bug in earlier versions of PrimeFaces (I am using 6.1). I cannot figure out why this error occurs.

@Kukeltje kindly pointed me to several posts showing that using an encoding type of multipart/form-data in a file-upload component or a form submit can cause this problem but my page has neither of these.

Here is an excerpt of my page:

<div align="center">        
    <h:form id="facilitatorTestsForm">
        <p:messages for="testBeanMessages" showSummary="true" showDetail="true" globalOnly="true" escape="false" autoUpdate="true" />
        Tests for which event? 
        <p:selectOneMenu value="#{testBean.selectedEventId}" style="top: 7px; ">
            <f:selectItem itemLabel="All Tests" itemValue="" />
            <f:selectItems value="#{testBean.facilitatorEvents}" var="event" itemValue="#{event.id}" itemLabel="#{event.name}"  />
            <f:ajax update="facilitatorTests" />
        </p:selectOneMenu>
        <p:commandButton value="Add a New Test" style="margin: 20px;" oncomplete="PF('newTestDialog').show();" actionListener="#{testBean.createEmptyNewTest}" immediate="true" />
        <p:dataTable var="test" value="#{testBean.testsForFacilitator}" rowIndexVar="index" id="facilitatorTests" widgetVar="facilitatorTests" selectionMode="single" selection="#{testBean.selectedTest}" rowKey="#{test.id}">
            <p:ajax event="rowSelect" oncomplete="PF('facilitatorEditTestDialog').show(); " update="@form:facilitatorEditTestDialog" />
            <p:column>#{index + 1}</p:column>
            <p:column headerText="Test" sortBy="#{test.name}" width="40%"><h:outputText value="#{test.name}" /></p:column>
            <p:column headerText="Tester" sortBy="#{test.tester.fullname}"><h:outputText value="#{test.tester.fullname}" /></p:column>
            <p:column headerText="Manager" sortBy="#{test.manager.fullname}"><h:outputText value="#{test.manager.fullname}" /></p:column>
            <p:column headerText="Event" sortBy="#{test.event.name}"><h:outputText value="#{test.event.name}" /></p:column>
            <p:column headerText="Functional Area" sortBy="#{test.functionalArea.name}"><h:outputText value="#{test.functionalArea.name}" /></p:column>
            <p:column headerText="Complete" width="150" sortBy="#{test.completionDate}"><h:outputText  value="#{test.completionDate == null ? 'Not Completed' : test.completionDate}"><f:convertDateTime pattern="M/d/yyyy hh:mm a" /></h:outputText></p:column>
            <p:column id="delete" style="text-align: center; vertical-align: middle; min-width: 54px; ">
                <p:commandButton update="facilitatorTests" process="facilitatorTests" icon="ui-icon-close" actionListener="#{testBean.deleteTest(test.id)}"
                        title="If the test has not been completed, it will be deleted permanently. Otherwise it will be archived."/>
            </p:column>
        </p:dataTable>
<... a few dialogs with conditional rendering ...>
    </h:form>
</div>

I have tried different targets for the selectOneMenu update attribute and it does not change the behavior so I believe it is correct.

Primefaces 6.1
Mojarra JSF API & IMPL 2.2.4
EL 3.0.0
Tomcat 7

Is this a JSF bug? Thanks for any help you can offer.

Answer 1

Found the solution. Thanks to @Kukeltje for staying with me through this even if he did downvote my question for not having enough info :)

It comes back to @BalusC's posts about not rendering the target of an ajax update. In this case I had several PrimeFaces TabView tabs containing <p:messages> tags with autoUpdate="true" , and the tabs are shown/hidden depending on the role of the user. When I removed autoUpdate="true" from these messages tags the problem went away. Apparently every time I did an ajax post, even if I had partial submit limited to rendered subelements of the current visible tab, autoUpdate causes JSF to try to update the messages tags in the unrendered tabs and of course they cannot be found.

The way I found this was to put id attributes EVERYWHERE, on every element in my forms. Then the Javascript error pointed me to a named (id'd) element, rather than one with an automatically assigned ID that I could not trace, and when I saw "autoUpdate" the light bulb came on. Moral: put ids on EVERYTHING.

I hope this helps someone with the same symptom to look for autoUpdate everywhere.

And @Kukeltje you were right that my post had inadequate information - without the enclosing tab tags with their rendered attributes you could not have seen the problem. Since they were in another template that ui:include s the forms I did not think they were relevant. Wrongo!