2014-10-23 5 views
7

मैं प्राइमफ़ेस डेटाटेबल आलसी लोडिंग पूर्ण होने के बाद बैक बैक अपडेट करना चाहता हूं। मैं देखता हूं कि एपीआई के पास क्लाइंटसाइड कोड को कॉल करने के लिए पूर्ण विधि पर ऑनस्यूस & है। लेकिन मैं डिफ़ॉल्ट चयन के आधार पर बैकिंग बीन अपडेट करना चाहता हूं। मैं के साथ "पेज" घटना पंजीकृत किया है मेरी datatableप्राइमफ़ेस पर डेटाटेबल आलसी लोडिंग पूर्ण अपडेट बैकिंग बीन

<p:ajax event="page" update="" onstart="PF('loadingDialog').show()" onsuccess="PF('loadingDialog').hide()" listener=""/> 

मैं श्रोता इस्तेमाल किया जा सकता था लेकिन समस्या यह श्रोता शुरू हो जाती है पहले भी सर्वर साइड लोडिंग विधि पूरा हो गया है है।

उत्तर

4

रिमोटकॉमैंड जावास्क्रिप्ट के साथ बीन विधियों का समर्थन करने का एक आसान तरीका प्रदान करता है।

उदाहरण नीचे दिखाया गया है।

एक्सएचटीएमएल

<h:form id="form"> 
    <p:remoteCommand name="rc" update="msgs" 
        actionListener="#{remoteCommandView.execute('Wittakarn')}" /> 
    <p:growl id="msgs" showDetail="true" /> 
    <p:dataTable var="car" value="#{dtLazyView.lazyModel}" 
       paginator="true" rows="10" 
       paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} 
       {PreviousPageLink} 
       {CurrentPageReport} 
       {NextPageLink} 
       {LastPageLink}" 
       rowsPerPageTemplate="5,10,15" 
       selectionMode="single" 
       selection="#{dtLazyView.selectedCar}" 
       id="carTable" 
       lazy="true"> 
     <p:ajax event="rowSelect" 
       listener="#{dtLazyView.onRowSelect}" 
       update=":form:carDetail" 
       oncomplete="PF('carDialog').show()" /> 
     <p:ajax event="page" 
       update=":form:carDetail" 
       oncomplete="rc()" /> 
     <p:column headerText="Id" 
        sortBy="#{car.id}" 
        filterBy="#{car.id}"> 
      <h:outputText value="#{car.id}" /> 
     </p:column> 
     <p:column headerText="Year" 
        sortBy="#{car.year}" 
        filterBy="#{car.year}"> 
      <h:outputText value="#{car.year}" /> 
     </p:column> 
     <p:column headerText="Brand" 
        sortBy="#{car.brand}" 
        filterBy="#{car.brand}"> 
      <h:outputText value="#{car.brand}" /> 
     </p:column> 
     <p:column headerText="Color" 
        sortBy="#{car.color}" 
        filterBy="#{car.color}"> 
      <h:outputText value="#{car.color}" /> 
     </p:column> 
    </p:dataTable> 

    <p:dialog header="Car Detail" 
       widgetVar="carDialog" 
       modal="true" showEffect="fade" 
       hideEffect="fade" 
       resizable="false"> 
     <p:outputPanel id="carDetail" 
         style="text-align:center;"> 
      <p:panelGrid columns="2" 
          rendered="#{not empty dtLazyView.selectedCar}" 
          columnClasses="label,value"> 
       <f:facet name="header"> 
        <p:graphicImage 
         name="demo/images/car/#{dtLazyView.selectedCar.brand}-big.gif"/> 
       </f:facet> 

       <h:outputText value="Id:" /> 
       <h:outputText value="#{dtLazyView.selectedCar.id}" /> 

       <h:outputText value="Year" /> 
       <h:outputText value="#{dtLazyView.selectedCar.year}" /> 

       <h:outputText value="Color:" /> 
       <h:outputText value="#{dtLazyView.selectedCar.color}" 
           style="color:#{dtLazyView.selectedCar.color}"/> 

       <h:outputText value="Price:" /> 
       <h:outputText value="#{dtLazyView.selectedCar.price}"> 
        <f:convertNumber type="currency" currencySymbol="$" /> 
       </h:outputText> 
      </p:panelGrid> 
     </p:outputPanel> 
    </p:dialog> 
</h:form> 

managedbean

@ManagedBean 
public class RemoteCommandView { 

    public void execute() { 
     FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, "Executed", "Using RemoteCommand.")); 
    } 

    public void execute(String detail) { 
     FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(FacesMessage.SEVERITY_INFO, detail, "Using RemoteCommand.")); 
    } 
} 

@ManagedBean(name="dtLazyView") 
@ViewScoped 
public class LazyView implements Serializable { 

    private LazyDataModel<Car> lazyModel; 

    private Car selectedCar; 

    @ManagedProperty("#{carService}") 
    private CarService service; 

    @PostConstruct 
    public void init() { 
     lazyModel = new LazyCarDataModel(service.createCars(200)); 
    } 

    public LazyDataModel<Car> getLazyModel() { 
     return lazyModel; 
    } 

    public Car getSelectedCar() { 
     return selectedCar; 
    } 

    public void setSelectedCar(Car selectedCar) { 
     this.selectedCar = selectedCar; 
    } 

    public void setService(CarService service) { 
     this.service = service; 
    } 

    public void onRowSelect(SelectEvent event) { 
     FacesMessage msg = new FacesMessage("Car Selected", ((Car) event.getObject()).getId()); 
     FacesContext.getCurrentInstance().addMessage(null, msg); 
    } 
} 

मॉडल

public class Car implements Serializable { 

    public String id; 
    public String brand; 
    public int year; 
    public String color; 
    public int price; 
    public boolean sold; 

    public Car() {} 

    public Car(String id, String brand, int year, String color) { 
     this.id = id; 
     this.brand = brand; 
     this.year = year; 
     this.color = color; 
    } 

    public Car(String id, String brand, int year, String color, int price, boolean sold) { 
     this.id = id; 
     this.brand = brand; 
     this.year = year; 
     this.color = color; 
     this.price = price; 
     this.sold = sold; 
    } 

    public String getId() { 
     return id; 
    } 
    public void setId(String id) { 
     this.id = id; 
    } 

    public String getBrand() { 
     return brand; 
    } 
    public void setBrand(String brand) { 
     this.brand = brand; 
    } 

    public int getYear() { 
     return year; 
    } 
    public void setYear(int year) { 
     this.year = year; 
    } 

    public String getColor() { 
     return color; 
    } 
    public void setColor(String color) { 
     this.color = color; 
    } 

    public int getPrice() { 
     return price; 
    } 
    public void setPrice(int price) { 
     this.price = price; 
    } 

    public boolean isSold() { 
     return sold; 
    } 
    public void setSold(boolean sold) { 
     this.sold = sold; 
    } 

    @Override 
    public int hashCode() { 
     int hash = 7; 
     hash = 59 * hash + (this.id != null ? this.id.hashCode() : 0); 
     return hash; 
    } 

    @Override 
    public boolean equals(Object obj) { 
     if (obj == null) { 
      return false; 
     } 
     if (getClass() != obj.getClass()) { 
      return false; 
     } 
     final Car other = (Car) obj; 
     if ((this.id == null) ? (other.id != null) : !this.id.equals(other.id)) { 
      return false; 
     } 
     return true; 
    } 
} 

CarService

import java.util.ArrayList; 
import java.util.Arrays; 
import java.util.List; 
import java.util.UUID; 
import javax.faces.bean.ApplicationScoped; 
import javax.faces.bean.ManagedBean; 
import org.primefaces.showcase.domain.Car; 

@ManagedBean(name = "carService") 
@ApplicationScoped 
public class CarService { 

    private final static String[] colors; 

    private final static String[] brands; 

    static { 
     colors = new String[10]; 
     colors[0] = "Black"; 
     colors[1] = "White"; 
     colors[2] = "Green"; 
     colors[3] = "Red"; 
     colors[4] = "Blue"; 
     colors[5] = "Orange"; 
     colors[6] = "Silver"; 
     colors[7] = "Yellow"; 
     colors[8] = "Brown"; 
     colors[9] = "Maroon"; 

     brands = new String[10]; 
     brands[0] = "BMW"; 
     brands[1] = "Mercedes"; 
     brands[2] = "Volvo"; 
     brands[3] = "Audi"; 
     brands[4] = "Renault"; 
     brands[5] = "Fiat"; 
     brands[6] = "Volkswagen"; 
     brands[7] = "Honda"; 
     brands[8] = "Jaguar"; 
     brands[9] = "Ford"; 
    } 

    public List<Car> createCars(int size) { 
     List<Car> list = new ArrayList<Car>(); 
     for(int i = 0 ; i < size ; i++) { 
      list.add(new Car(getRandomId(), getRandomBrand(), getRandomYear(), getRandomColor(), getRandomPrice(), getRandomSoldState())); 
     } 

     return list; 
    } 

    private String getRandomId() { 
     return UUID.randomUUID().toString().substring(0, 8); 
    } 

    private int getRandomYear() { 
     return (int) (Math.random() * 50 + 1960); 
    } 

    private String getRandomColor() { 
     return colors[(int) (Math.random() * 10)]; 
    } 

    private String getRandomBrand() { 
     return brands[(int) (Math.random() * 10)]; 
    } 

    private int getRandomPrice() { 
     return (int) (Math.random() * 100000); 
    } 

    private boolean getRandomSoldState() { 
     return (Math.random() > 0.5) ? true: false; 
    } 

    public List<String> getColors() { 
     return Arrays.asList(colors); 
    } 

    public List<String> getBrands() { 
     return Arrays.asList(brands); 
    } 
} 

आप अधिक विवरण देखने कर सकते हैं: RemoteCommand

+0

मैंने इस तरह कुछ जोड़ा लेकिन डेटा खोजने योग्य लोड के बाद मेरी खोज विधि लागू नहीं की गई है। क्या आप यहां कुछ भी गलत देखते हैं? – vinay

+0

@vinay कृपया अपना प्रबंधित कीबोर्ड दिखाएं। – wittakarn

+0

दोस्त धन्यवाद। वास्तविक समस्या यह है कि मेरे रिमोट कमांड को डेटाटेबल के अंदर घोषित किया गया था। आप उदाहरण भी उचित घोषणा। वैसे भी रिमोट कमांड जाने का रास्ता था। – vinay

3

जब से मैं वेनिला JSF का उपयोग कर पसंद करते हैं, मैं क्या करना होगा निम्नलिखित

अपनी मेज

<h:commandButton id="call-me-after-page" 
       style="display:none;" action="#{myBean.myAction}"> 
       <f:ajax execute="@form" render="@form"></f:ajax> 
      </h:commandButton> 

ऊपर इस डाल दिया और oncomplete इस तरह सेट करें:

<p:ajax event="page" oncomplete="$('#call-me-after-page').click();"></p:ajax> 
+0

धन्यवाद डैनियल। अभी मैं छिपे हुए कमांड बटन पर रिमोट कमांड पसंद करता हूं। बीटीडब्ल्यू ने मुझे जेएसएफ में चीजों को करने के और तरीके दिखाए। – vinay

+0

@vinay, असंबंधित, आप किस पीएफ का उपयोग कर रहे हैं? – Daniel

+0

मैं प्राइमफेस 4.0 पर हूं। – vinay

संबंधित मुद्दे