2017-12-19 43 views
0

Ich mache eine JSF-Website (bootssfaces, xhtml, netbeans). Ich habe ein Suchfeld, um nach Vogelarten zu suchen (es funktioniert bereits), aber wenn ich auf ein Ergebnis (in einer Datentabelle) klicke, möchte ich ein DIV aktualisieren, das detaillierte Informationen über diesen Vogel enthält. Aber ich kann nicht herausfinden, wie das geht.Bootsfaces werden aktualisiert, wenn "onSelect" dataTableColumn

Meine XHTML ist:

<div class="col-xs-12 col-lg-3"> 
    <!--SEARCH--> 
    <div class="form-group"> 
     <label>Rechercher une espèce :</label> 
     <b:form prependId="false"> 
      <div class="row"> 
       <div class="col-xs-10"> 
        <b:inputText id="speciesTxt" value="#{speciesCaller.speciesSearchText}" class="form-control"/> 
       </div> 
       <div class="col-xs-2"> 
        <b:commandButton action="#{speciesCaller.searchSpecies()}" type="button" class="btn btn-primary"> 
         <span class="glyphicon glyphicon-search"></span> 
         <f:ajax execute="speciesTxt" event="click" render="output"></f:ajax> 
        </b:commandButton> 
       </div> 
      </div> 
     </b:form> 

     <!--SEARCH RESULTS--> 
     <b:dataTable id="output" paginated="false" searching="false" class="table table-hover" 
       value="#{speciesCaller.foundSpecies}" var="species" selectionMode="single" select="true" 
       info="false" onselect="ajax:speciesCaller.onSelect(species);"> 
      <b:dataTableColumn value="#{species.name}"> 
       <f:facet name="header"> 
        Nom 
       </f:facet> 
      </b:dataTableColumn> 
     </b:dataTable> 
    </div> 
</div> 

<!--SPECIES INFO--> 
<div id="speciesInfos" class="col-xs-12 col-lg-5"> 
    SPECIES INFO 
    #{speciesCaller.selectedSpecies.name} 
</div> 

Und mein BEAN:

@ManagedBean 
@SessionScoped 
public class SpeciesCaller { 

    private String speciesSearchText; 
    public void setSpeciesSearchText(String speciesSearchText){ 
     this.speciesSearchText = speciesSearchText; 
    } 
    public String getSpeciesSearchText(){ 
     return this.speciesSearchText; 
    } 

    private List<Species> foundSpecies; 
    public List<Species> getFoundSpecies() { 
     return foundSpecies; 
    } 
    public void setFoundSpecies(List<Species> foundSpecies) { 
     this.foundSpecies = foundSpecies; 
    } 

    private Species selectedSpecies; 
    public Species getSelectedSpecies() { 
     return selectedSpecies; 
    } 
    public void setSelectedSpecies(Species selectedSpecies) { 
     this.selectedSpecies = selectedSpecies; 
    } 


    public void searchSpecies() throws UnirestException{ 
     MainCaller mc = new MainCaller(); 
     if(speciesSearchText.equals("null") || speciesSearchText.equals("")){ 
      foundSpecies = mc.getToSpeciesList("species"); 
     }else{ 
      foundSpecies = mc.getToSpeciesList("species/search/"+this.speciesSearchText); 
     } 
    } 

    public void onSelect(Species species) { 
     selectedSpecies = species; 
    } 
} 

Antwort

1

ich die Antwort gefunden, war es leicht, in der Tat ... Sie nicht ein div aktualisieren kann (glaube ich) , müssen Sie ein bootsfaces-Element aktualisieren (ich habe ab: form in meinem div). Dann müssen Sie nur seine ID in der Datentabelle mit update = "idYouChoose"

beziehen
Verwandte Themen