Обновление данных dataTable после нажатия на кнопку «Поиск» - PullRequest
Новая
       52

Обновление данных dataTable после нажатия на кнопку «Поиск»

0 голосов
/ 19 марта 2012

Как только страница xyz.xhtml загружается, я отображаю 10 записей. 

<h:dataTable var="c" value="#{userServiceBean.showTop10Applicant()}"
   styleClass="order-table"
   headerClass="order-table-header"
   rowClasses="order-table-odd-row,order-table-even-row"
   border="1" id="appListDataTable" width="100%">
  <h:column>
  <f:facet name="header">
    Applicant Name
  </f:facet>
    #{c.displayName}
  </h:column>
</dataTable>

В showTop10Applicant() Я возвращаю 10 случайных записей.

Над этой таблицей данных у меня есть текстовое поле поиска и кнопка поиска. Я использовал ajax для проверки данных. 

<h:inputText id="searchApplicant" value="#{userDataBean.toSearch}" /> &nbsp;&nbsp;+&nbsp;&nbsp;
<h:commandButton value="Search" action="#{userServiceBean.searchApplicantsByCriteria()}">
    <f:ajax execute="searchApplicant"  render=":appListDataTable"/>
</h:commandButton>

В searchApplicantsByCriteria() Я показываю все записи, которые у меня есть (сейчас я не проверяю никаких критериев).

НО , когда Я нажимаю Поиск , я получаю те же 10 записей назад, что и раньше.

Может кто-нибудь помочь, если я ошибаюсь.

Обновление 1

Ниже я хочу сделать следующее.

Я хочу найти некоторых людей, которые есть в базе данных. Когда страница загружается, я отображаю случайные 10 человек, используя dataTable (используя метод showTop10Applicant()).

В текстовом поле поиска я пишу abc и нажимаю кнопку поиска. Что я хочу, так это чтобы dataTable, который уже присутствует (где мы отображаем 10 случайных записей), обновлялся с помощью поиска abc. Допустим, есть 2 человека, имя которых содержит abc, тогда я должен получить только список этих двух человек.

Надежда Теперь все ясно. Дайте мне знать, если есть какие-либо вопросы.

Обновление 2 

<?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:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:body>
    <ui:composition template="../layout/homeLayout.xhtml">
        <ui:define name="content">
        <center>
            <h2>
            <u>
                <h:outputText value="Manage Applicants"></h:outputText>
            </u>
            </h2>
        </center>
        <br />
        <h:form id="myForm002" prependId="false">

            <div align="right">
            <h:inputText id="searchApplicant" value="#{userDataBean.toSearch}" /> &nbsp;&nbsp;+&nbsp;&nbsp;

            <h:selectOneMenu value="#{userDataBean.status}">
                <f:selectItem itemValue="ALL" itemLabel="All" />
                <f:selectItem itemValue="A" itemLabel="Active" />
                <f:selectItem itemValue="IA" itemLabel="Inactive" />
            </h:selectOneMenu>
            &nbsp;&nbsp;

            <h:commandButton value="Search" action="#{userServiceBean.searchApplicantsByCriteria()}">
                <f:ajax execute="searchApplicant"  render=":myForm001:appListDataTable"/>
            </h:commandButton>

            </div>
        </h:form>
        <hr width="100%"></hr>
        <br />

        <center>
            <h:form id="myForm001" prependId="false">    
            <f:metadata>
                <f:event listener="#{userServiceBean.showTop10Applicant()}" type="preRenderView" />
            </f:metadata>
            <h:dataTable var="c" value="#{userServiceBean.showTop10Applicant()}"
                     styleClass="order-table"
                     headerClass="order-table-header"
                     rowClasses="order-table-odd-row,order-table-even-row"
                     border="1" id="appListDataTable" width="100%">
                <h:column>
                <f:facet name="header">
                    Applicant Name
                </f:facet>
                #{c.displayName}
                </h:column>

                <h:column>
                <f:facet name="header">
                    User ID
                </f:facet>
                #{c.userId}
                </h:column>

                <h:column>
                <f:facet name="header">
                    Email ID
                </f:facet>
                #{c.email}
                </h:column>

                <h:column>
                <f:facet name="header">
                    Mobile Number
                </f:facet>
                #{c.contactReference}
                </h:column>

                <h:column>
                <f:facet name="header">
                    Active?
                </f:facet>
                <h:selectBooleanCheckbox value="#{c.isActive}"></h:selectBooleanCheckbox>
                </h:column>
            </h:dataTable>
            <br />
            </h:form>
        </center>
        </ui:define>
    </ui:composition>
    </h:body>
</html>

Ответы [ 2 ]

0 голосов
/ 19 марта 2012

Вы обновляете не тот компонент.«:» Является корнем документа, и у вас наверняка есть тег формы, обернутый вокруг вашей таблицы данных (поэтому я и попросил форму).Поэтому, по крайней мере, вы должны использовать что-то вроде этого: 

render=":formId:appListDataTable"

Замените formId своим реальным идентификатором формы.Это предполагает, что между ними нет других контейнеров именования, например h:panelGroup и т. Д.

Если оба (поле ввода и таблица) находятся внутри одного контейнера именования, вы можете опустить двоеточие: 

render="appListDataTable"

Кроме того, могут быть и другие источники ошибок.Я бы заподозрил ваши методы поддержки компонентов (как прокомментировал Дэниел, поэтому я попросил код компонента).

0 голосов
/ 19 марта 2012

Вам нужно обернуть таблицу данных в PanelGroup как <h:panelGroup id="dataTableGroup">, а затем вызвать <f:ajax execute="searchApplicant" render="dataTableGroup"/>. Это должно работать.

...