【问题标题】:On Primefaces datatable lazy loading complete update backing bean在 Primefaces 数据表延迟加载完整更新支持 bean
【发布时间】:2014-12-19 09:40:14
【问题描述】:

我想在 primefaces 数据表延迟加载完成后更新支持 bean。我看到 API 有一个 onSuccess 和 onComplete 方法来调用客户端代码。但我想根据默认选择更新支持 bean。我已经用我的数据表注册了“页面”事件

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

我本来可以使用监听器,但问题是监听器在服务器端加载方法完成之前就被调用了。

【问题讨论】:

    标签: primefaces


    【解决方案1】:

    RemoteCommand 提供了一种使用 javascript 执行支持 bean 方法的简单方法。

    示例如下所示。

    xhtml

    <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
    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;
        }
    }
    

    汽车服务

    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

    【讨论】:

    • 我添加了类似的内容,但在数据表加载后未调用我的 find 方法。你觉得这里有什么问题吗?
    • 谢谢哥们。实际问题是我的远程命令是在数据表中声明的。你的例子也是正确的声明。无论如何,远程命令是要走的路。
    • @wittakam 这里有问题。最初加载数据表时不会触发页面事件。只有当我点击数据表中的页面时才会触发它。您是否看到过类似的行为?
    • @vinay 基本上,只要页面更改, event="page" 就会触发。如果你想在加载数据表后做一些事情,你可以用一个用于初始化数据表的方法来做。究竟是什么问题?
    • 最后我找到了解决方案。没有数据表加载事件。我使用了触发数据表加载方法的 UI 组件的“onComplete”方法。解决方案听起来很简单。
    【解决方案2】:

    由于我更喜欢​​使用香草 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>
    

    【讨论】:

    • 谢谢丹尼尔。现在我更喜欢远程命令而不是隐藏命令按钮。顺便说一句,你向我展示了更多在 JSF 中做事的方式。
    • @vinay,不相关,您使用的是什么版本的 pf?
    • 我在 PrimeFaces 4.0 上。
    猜你喜欢
    • 2013-10-10
    • 1970-01-01
    • 2016-11-02
    • 2013-01-09
    • 2012-03-01
    • 2015-01-30
    • 2012-04-21
    • 2013-06-17
    • 2014-01-25
    相关资源
    最近更新 更多