3 Replies Latest reply on Oct 12, 2009 5:40 AM by ilya_shaikovsky

    Re-rendered table does not select the right row

      Re-rendered table does not select the right row

      Hi All,

      I have a rich:modalPanel with a form inside. The modal panel contains a data table with the list from a SEAM EntityQuery List.
      Each entry from the modalPanel dataTable list has a a:commandLink which will update a comboBox on the parent form (a model from an EntityHome instance).

      I can select the entry with the commandLink and the related ComboBox from the parent form is re-rendered OK.

      In the modalPanel form, I have one text field with a:support, event=onkeyup, which updates EntityQuery list and refresh the data table.

      The problem is that after the data table refresh, when I click on the select commandLink, the selected component is the one that was originally on that row and not the right component.

      Example:

      Data Table without filter
      -------------------------------
      id | Name | Action |
      -------------------------------
      1 | First component | Select
      2 | Second Component | Select
      3 | Third Component | Select


      Re-rendered Data Table with filter Name LIKE 'Second'
      -------------------------------
      id | Name | Action |
      -------------------------------
      2 | Second Component | Select


      Selecting the component with id 2 Second Component from the filtered table, the component selected is 1 - First component which was originally on the first position (row) in the table.

      Code:

      Parent form:
      ------------

      <h:form id="company" styleClass="edit">

      <rich:panel>
      <f:facet name="header">#{companyHome.managed ? 'Edit' : 'Add'} Company</f:facet>

      <s:decorate id="nameField" template="layout/edit.xhtml">
      <ui:define name="label">Name</ui:define>
      <h:inputText id="name"
      required="true"
      size="50"
      maxlength="50"
      value="#{companyHome.instance.name}">
      <a:support event="onblur" reRender="nameField" bypassUpdates="true" ajaxSingle="true"/>
      </h:inputText>
      </s:decorate>


      <s:decorate id="primaryContactNameField" template="layout/edit.xhtml">
      <ui:define name="label">Primary Contact Name
      <a:commandLink value="Select..." onclick="#{rich:component('modalPanel')}.show()" reRender="searchCntForm"/>
      </ui:define>
      <h:selectOneMenu id="primaryContact" value="#{companyHome.instance.primaryContact}">
      <s:selectItems noSelectionLabel="--- Select Contact ---" value="#{customerList.resultList}" var="cnt" label="#{cnt.firstname}, #{cnt.lastname}"/>
      <s:convertEntity/>
      </h:selectOneMenu>
      </s:decorate>

      </rich:panel>



      <h:commandButton id="save"
      value="Save"
      action="#{companyHome.persist}"
      disabled="#{!companyHome.wired}"
      rendered="#{!companyHome.managed}"/>

      <h:commandButton id="update"
      value="Save"
      action="#{companyHome.update}"
      rendered="#{companyHome.managed}"/>

      <h:commandButton id="delete"
      value="Delete"
      action="#{companyHome.remove}"
      immediate="true"
      rendered="#{companyHome.managed}"/>

      <s:button id="cancelEdit"
      value="Cancel"
      propagation="end"
      view="/Company.xhtml"
      rendered="#{companyHome.managed}"/>

      <s:button id="cancelAdd"
      value="Cancel"
      propagation="end"
      view="/#{empty companyFrom ? 'CompanyList' : companyFrom}.xhtml"
      rendered="#{!companyHome.managed}"/>


      </h:form>

      Modal Panel:
      ------------

      <rich:modalPanel id="modalPanel" autosized="true">
      <f:facet name="header">
      Modal panel
      </f:facet>
      <f:facet name="controls">
      <h:graphicImage value="/img/close.png" style="cursor:pointer"
      onclick="#{rich:component('modalPanel')}.hide()" />
      </f:facet>
      <h:form>
      <h:panelGrid id="searchCntForm">
      <h:outputText value="Last Name:"/>
      <h:inputText value="#{customerSearchList.customer.lastname}">
      <a:support id="onkeyup" event="onkeyup" reRender="customerSearchListPanel, customerSearchListTable" />
      </h:inputText>
      <a:outputPanel id="customerSearchListPanel">
      <rich:dataTable id="customerSearchListTable"
      var="_customer"
      value="#{customerSearchList.resultList}"
      rendered="#{not empty customerSearchList.resultList}">
      <h:column>
      <f:facet name="header">
      Id
      </f:facet>
      <h:outputText value="#{_customer.id}"/>
      </h:column>
      <h:column>
      <f:facet name="header">
      First Name
      </f:facet>
      <h:outputText value="#{_customer.firstname}"/>
      </h:column>
      <h:column>
      <f:facet name="header">
      Last Name
      </f:facet>
      <h:outputText value="#{_customer.lastname}"/>
      </h:column>
      <h:column styleClass="action">
      <f:facet name="header">Action</f:facet>
      <a:commandLink value="Select" id="savecnt" reRender="primaryContactNameField"
      oncomplete="Richfaces.hideModalPanel('modalPanel')"
      title="Select customer #{_customer.id}"
      action="#{companyHome.instance.setPrimaryContact(_customer)}"
      >
      </a:commandLink>
      </h:column>
      </rich:dataTable>
      <a:commandButton value="Close" id="closecnt" oncomplete="Richfaces.hideModalPanel('modalPanel')" />
      <a:commandButton value="Select" id="savecnt" reRender="primaryContactNameField" oncomplete="Richfaces.hideModalPanel('modalPanel')" />
      </a:outputPanel>
      </h:panelGrid>
      </h:form>
      </rich:modalPanel>