0

,I have a one-page RichFaces application (RichFaces 4.2.3, JSF 2.0.3) that has a single form in which I've "ajaxified" all the components by wrapping the panels with a4j:ajax. The submit button is outside this wrapping but I'm using a4j:commandButton. The button is conditionally disabled with a call to a bean isValid() method. When conditions are right in the bean, the button gets enabled.

          <a4j:commandButton id="submitButton"
            value="Save to Database"
            disabled="#{!submission.isValid()}" render="bodyPanel"
            action="#{submission.submitAnnotations}">
            <rich:componentControl target="savedPopup"
              event="complete" operation="show" />
            <rich:tooltip id="submitButtonTooltip" mode="client"
              target="submitButton">Submit the completed annotations to TAIR.
            </rich:tooltip>
          </a4j:commandButton>

I have rendered attributes on the various fields that can affect the validity. When the conditions are correct, the button enables, but instead of being a submit button, it looks like this:

<input id="bodyForm:submitButton" name="undefined" onclick="return false;" value="undefined" type="submit">

So the label changes from "Save to Database" to "undefined". If I click on the button, nothing happens (the submitAnnotations method is not called). There are no javascript errors at any point in this process, but it looks like there are ajax errors:

info [11:04:32.529]: Received 'begin' event from <span id=bodyForm:locusTable:0:functionTable:0:functionTerm class=rf-au termAutoStyle ...>
info [11:04:32.587]: Received 'beforedomupdate' event from <span id=bodyForm:locusTable:0:functionTable:0:functionTerm class=rf-au termAutoStyle ...>
info [11:04:32.590]: Listing content of response changes element:
Element update for id=bodyForm:locusTable:0:j_idt48
<update id="bodyForm:locusTable:0:j_idt48"><![CDATA[<span class="rf-msg errorMessage" id="bodyForm:locusTable:0:j_idt48"></span>]]></update>
Element update for id=bodyForm:locusTable:0:j_idt53
<update id="bodyForm:locusTable:0:j_idt53"><![CDATA[<span class="rf-msg errorMessage" id="bodyForm:locusTable:0:j_idt53"></span>]]></update>
Element update for id=bodyForm:locusTable:0:functionTable:0:functionTerm
<update id="bodyForm:locusTable:0:functionTable:0:functionTerm"><![CDATA[<span class="rf-au termAutoStyle" id="bodyForm:locusTable:0:functionTable:0:functionTerm"><input id="bodyForm:locusTable:0:functionTable:0:functionTermValue" name="bodyForm:locusTable:0:functionTable:0:functionTermValue" type="hidden" /><span><input autocomplete="off" class="rf-au-fnt rf-au-inp " id="bodyForm:locusTable:0:functionTable:0:functionTermInput" name="bodyForm:locusTable:0:functionTable:0:functionTermInput" type="text" value="phytoene dehydrogenase activity" tabindex="8" /></span><div class="rf-au-lst-cord" id="bodyForm:locusTable:0:functionTable:0:functionTermList"><div class="rf-au-shdw"><div class="rf-au-shdw-t"></div><div class="rf-au-shdw-l"></div><div class="rf-au-shdw-r"></div><div class="rf-au-shdw-b"></div><div class="rf-au-lst-dcrtn termAutoPopupStyle"><div class="rf-au-lst-scrl"><table id="bodyForm:locusTable:0:functionTable:0:functionTermItems" class="rf-au-tbl"><tbody></tbody></table></div></div></div></div><script type="text/javascript">new RichFaces.ui.Autocomplete("bodyForm:locusTable:0:functionTable:0:functionTerm", "bodyForm:locusTable:0:functionTable:0:functionTermInput", {"buttonId":"bodyForm:locusTable:0:functionTable:0:functionTermButton","onchange":function(event){RichFaces.ajax(this,event,{"parameters":{"javax.faces.behavior.event":"change","org.richfaces.ajax.component":"bodyForm:locusTable:0:functionTable:0:functionTerm"} ,"sourceId":this} )},"minChars":2} );</script></span>]]></update>
Element update for id=bodyForm:locusTable:0:functionTable:0:fMethodMessage
<update id="bodyForm:locusTable:0:functionTable:0:fMethodMessage"><![CDATA[<span class="rf-msg errorMessage" id="bodyForm:locusTable:0:functionTable:0:fMethodMessage"></span>]]></update>
Element update for id=bodyForm:submitButton
<update id="bodyForm:submitButton"><![CDATA[<span id="bodyForm:submitButtonTooltip" style="display: none;"><span id="bodyForm:submitButtonTooltip:wrp" class="rf-tt" style="z-index:1000"><span id="bodyForm:submitButtonTooltip:cntr" class="rf-tt-cntr"><span id="bodyForm:submitButtonTooltip:content" class="rf-tt-cnt">Submit the completed annotations to TAIR.</span></span></span></span><input id="bodyForm:submitButton" name="bodyForm:submitButton" onclick="return false;" value="Save to Database" disabled="disabled" type="submit" />]]></update>
Element update for id=bodyForm:submissionMessages
<update id="bodyForm:submissionMessages"><![CDATA[<span class="rf-msgs " id="bodyForm:submissionMessages"></span>]]></update>
Element update for id=javax.faces.ViewState
<update id="javax.faces.ViewState"><![CDATA[-597202710648046990:-4469349859912622104]]></update>
Element extension for id=org.richfaces.extension
<extension id="org.richfaces.extension"><complete>new RichFaces.ui.Tooltip("bodyForm:submitButtonTooltip",{"ajax":{"incId":"1"} ,"target":"bodyForm:submitButton","offset":[10,10] } );new RichFaces.ui.Message("bodyForm:locusTable:0:j_idt48",{"forComponentId":"bodyForm:locusTable:0:symbol","showSummary":false,"showDetail":true} );new RichFaces.ui.Message("bodyForm:locusTable:0:j_idt53",{"forComponentId":"bodyForm:locusTable:0:fullName","showSummary":false,"showDetail":true} );new RichFaces.ui.Message("bodyForm:locusTable:0:functionTable:0:fMethodMessage",{"forComponentId":"bodyForm:locusTable:0:functionTable:0:fMethod","showDetail":true} );new RichFaces.ui.Message("bodyForm:submissionMessages",{"showDetail":true,"globalOnly":true,"isMessages":true} );</complete></extension>
error[11:04:32.593]: Received 'error@malformedXML' event from <span id=bodyForm:locusTable:0:functionTable:0:functionTerm class=rf-au termAutoStyle ...>
error[11:04:32.594]: [200] undefined: undefined
info [11:04:32.594]: Received 'complete' event from <span id=bodyForm:locusTable:0:functionTable:0:functionTerm class=rf-au termAutoStyle ...>

I'm none the wiser from this debugging output. Has anyone seen anything like this?

Bob Muller
  • 55
  • 8
  • I discovered that if I reload the application, the button changes to what it should be and is fully functional. So I'm suspecting an ajax render problem in the RichFaces code. – Bob Muller Aug 15 '13 at 00:14

1 Answers1

0

As it turns out, the answer to this is generic to jsf ajax:

JSF 2.0, malformedXML when using ajax on a commandlink

I put the command button code above into a panel and changed the render to render the buttonPanel rather than the submitButton, and now it works as advertised:

      <a4j:outputPanel id="buttonPanel">
        <h:panelGrid columns="3">
          <a4j:commandButton id="submitButton"
            value="Save to Database"
            disabled="#{!submission.isValid()}" render="bodyPanel"
            action="#{submission.submitAnnotations}">
          </a4j:commandButton>
       ...

The render needs HTML from the panel to render, the button isn't enough.

Community
  • 1
  • 1
Bob Muller
  • 55
  • 8