2014-01-05 2 views
2

У меня есть проект JSF с PrimeFaces.JSF/Primefaces: открыть диалог, щелкнув по записи datatable

У меня есть «панель» в моем проекте, которая содержит небольшую панель p: с p: datatable. Мои данные в моей таблице динамически обновляются моими бобами. Я хочу, чтобы нажимать на один из ярлыков, чтобы открыть диалог с большим количеством данных.

Это то, что типичный столбец выглядит следующим образом:

<p:column style="text-align: left"> 
    <f:facet name="header"> 
     <h:outputText value="Name"/> 
    </f:facet> 
    <h:outputText value="#{t.name}" style="text-align: left"/> 
</p:column> 

Тогда я бы еще один столбец на что-то вроде сумм или времени, это зависит.

В моем bean-компоненте у меня есть запрос sql и заполняется список, который заполняет datatable, ничего сложного.

Как бы я работал - эффективно - создание или замена выходного текста так, чтобы оно было интерактивным и открывало диалог, который будет заполнен данными на основе того, на какое значение я нажал.

Проблема я думаю, что я мог бы столкнуться в том, что значение в этом столбце является именем, а не ID в моем дБ (что мне нужно будет, чтобы получить остальные данные для заполнения диалогового окна)

Должен ли я изменить outputText на ссылку и иметь какой-то вызов ajax, чтобы открыть диалоговое окно и получить данные?

+0

http://www.primefaces.org/showcase/ui/datatableRowSelectionByColumn.jsf;jsessionid=16tgvgc74n5pm29gcoxo1gf4h – Makky

+0

Это может работать, но я хотите знать, как я могу сделать «Имя» кликабельным (почти как установка selectionmode) и на этом щелчке, чтобы открыть диалог. –

ответ

7

Вы можете использовать groundfaces commandLink. Ниже приводится полный рабочий пример

XHTML файл

<!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:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:p="http://primefaces.org/ui"> 
<h:head> 
</h:head> 
<h:body> 
    <h:form id="form"> 
     <p:dataTable value="#{mbean.personList}" var="person"> 
      <p:column headerText="Name"> 
       <p:commandLink value="#{person.name}" oncomplete="test.show()" 
        update=":form:dialog"> 
        <f:setPropertyActionListener target="#{mbean.selectedPerson}" 
         value="#{person}" /> 
       </p:commandLink> 
      </p:column> 
      <p:column headerText="Country"> 
       #{person.country} 
      </p:column> 
     </p:dataTable> 
     <p:dialog modal="true" width="500" height="500" widgetVar="test" 
      id="dialog"> 
      Name : #{mbean.selectedPerson.name} 
     </p:dialog> 
    </h:form> 
</h:body> 
</html> 

Managed Bean

import java.io.Serializable; 
import java.util.ArrayList; 
import java.util.List; 

import javax.faces.bean.ManagedBean; 
import javax.faces.bean.ViewScoped; 

@ManagedBean(name = "mbean") 
@ViewScoped 
public class TestBean implements Serializable { 

    private List<Person> personList; 
    private Person selectedPerson; 

    public TestBean() { 
     personList = new ArrayList<Person>(); 
     personList.add(new Person("AKN", "UK")); 
     personList.add(new Person("AKF", "Australia")); 
     personList.add(new Person("AKH", "Asia")); 

    } 

    public List<Person> getPersonList() { 
     return personList; 
    } 

    public void setPersonList(List<Person> personList) { 
     this.personList = personList; 
    } 

    public Person getSelectedPerson() { 
     return selectedPerson; 
    } 

    public void setSelectedPerson(Person selectedPerson) { 
     System.out.println("selected" + selectedPerson.getName()); 
     this.selectedPerson = selectedPerson; 
    } 

} 

Person класса

import java.io.Serializable; 

public class Person implements Serializable{ 

    private String name; 
    private String country; 


    public Person(String name, String country) { 
     super(); 
     this.name = name; 
     this.country = country; 
    } 
    public String getName() { 
     return name; 
    } 
    public void setName(String name) { 
     this.name = name; 
    } 
    public String getCountry() { 
     return country; 
    } 
    public void setCountry(String country) { 
     this.country = country; 
    } 

} 

Выход

On page load When clicking on name

+0

Perfect. Именно то, что я хотел. –

+0

Рад, что это помогло. – Makky

+1

Удивительный, он работал. Для других, для Primefaces 5, используйте oncomplete = "PF ('test'). Show()". –

Смежные вопросы