[a4j:param] bean property setted only after a page refresh

[raid3n]

Suppose I have html element with an attribute "selectorattr" and on click I want to set a bean property: bean.header. Then I want use bean.header as header text for mine rich popupPanel. The problem is that the #{bean.header} is not setted instantly but only after a refresh of the page.

Example code:

<h:inputText selectorattr="something" value="" />

<rich:popupPanel id="confirmPane"  header="#{bean.header}" />

<a4j:jsFunction name="myfunction">

                                        <a4j:param name="myparam" assignTo="#{bean.header}"></a4j:param>

                              </a4j:jsFunction>

                              <rich:jQuery selector="[selectorattr]" query="myfunction($(this).attr('selectorattr')); #{rich:component('confirmPane')}.show(); "

                                        event="click" />

Why?

[raid3n]

Solved, I missed the render attribute:

<a4j:jsFunction name="myfunction" render="confirmPane" oncomplete="#{rich:component('confirmPane').show()">

      <a4j:param name="myparam" assignTo="#{bean.header}" />

</a4j:jsFunction>

[ilya_shaikovsky]

Let's finish with that created two samples:

<table  width="400">

                    <tbody>

                    <tr>

                              <td><span onmouseover="updateName('Kate')">Kate</span></td>

                              <td><span onmouseover="jQuery('.headerOut').text('John');#{rich:component('showname')}.show();">John</span></td>

  </tr>

                    <rich:spacer height="10" />

                    </tbody>

          </table>

          <rich:modalPanel id="showname">

                    <f:facet name="header">

                              <h:outputText value="#{userBean.name}" styleClass="headerOut"/>

                    </f:facet>

          </rich:modalPanel>

          <a4j:form>

                    <a4j:jsFunction name="updateName" reRender="showname" oncomplete="#{rich:component('showname')}.show();">

                              <a4j:actionparam name="param1" assignTo="#{userBean.name}"          />

                    </a4j:jsFunction>

          </a4j:form>

first td  hover performs update and show via ajax.

second td hover changes the header and showing the panel without any requests.