扩大了PrimeFaces的DataTable的行不端行为

时间:2013-08-08 16:25:47

标签: jsf primefaces datatable

我不确定这是否是数据表的行扩展错误行为,还是我做错了什么。对于问题的描述,我会尽可能简单。

首先,尝试像PrimeFaces的展示一样制作一个DataTable,其中包含一个可以“改变”汽车颜色的Car列表。这很简单!

然后实现其rowExpansion以便通过commandButton对属性ActionListener进行部分处理。直到那里,一切都很好。所以现在尝试展开最后一行,然后尝试展开中间的那一行,然后单击第一个展开行的commandButton,然后你会发现属性ActionListener集将被指向或与第二个展开相关行。在我的例子中,我只用3行填充数据表。

如果您尝试仅展开一行,则会获得预期的行为。

似乎扩展过程会覆盖以前处理的模型或某种远离知识的其他不当行为。

请参阅以下摘录。

<p:dataTable id="carsTable" var="car" value="#{bean.carsSmall}">
  <p:ajax event="rowToggle" listener="#{bean.onRowToggle}" />
     <p:column style="width:2%">
        <p:rowToggler />
     </p:column>

    <p:column style="width:49%">
      <h:outputText value="#{car.model}" />
    </p:column>

    <p:column style="width:49%">
      <h:outputText value="#{car.year}" />
    </p:column>

    <p:rowExpansion>
       <ui:repeat var="color" value="#{bean.availableColors}">
          <p:commandButton action="#{bean.chooseColor}" value="#{color.color}">
              <f:setPropertyActionListener target="#{bean.selectedColor}" value="#{color}" />
          </p:commandButton>
       </ui:repeat>

    </p:rowExpansion>
</p:dataTable>

@ManagedBean 
@SessionScoped 
public class Bean implements java.io.Serializable {

    private static final long serialVersionUID = 1708652163041196763L;

    private List<Car> carsSmall = new ArrayList<Car>();
    private final List<Color> availableColors = new ArrayList<Color>();
    private Color selectedColor;

    public Bean() {
        carsSmall.add(new Car("81025d15", "2011"));
        carsSmall.add(new Car("44194657", "2012"));
        carsSmall.add(new Car("482f2a60", "2013"));
    }

    public void clear(){
        this.availableColors.clear();
    }

    public void chooseColor(){
        System.out.println(this.selectedColor.getColor());
    }

    public void onRowToggle(ToggleEvent event) {
        // This is a dummy logic for this example...
        Car car = (Car) event.getData();
        this.availableColors.clear();

        if (car.getModel().equals("81025d15")) {
            this.availableColors.add(new Color("RED"));
            this.availableColors.add(new Color("GREEN"));
            this.availableColors.add(new Color("BLUE"));
        } else if (car.getModel().equals("44194657")) {
            this.availableColors.add(new Color("YELLOW"));
            this.availableColors.add(new Color("GRAY"));
            this.availableColors.add(new Color("BLACK"));
        } else if (car.getModel().equals("482f2a60")) {
            this.availableColors.add(new Color("ORANGE"));
            this.availableColors.add(new Color("BROWN"));
            this.availableColors.add(new Color("PINK"));
        }

    }
    // GETTERS and SETTERS...
}

对于那些将使用<ui:repeat>指出问题原因的人来说,<h:dataTable><p:dataTable>

也会注意到这种不当行为

此示例不能将bean设置为RequestScopedViewScoped

1 个答案:

答案 0 :(得分:0)

正如我在PrimeFaces forum: Expanded DataTable's rows misbehavior中所述,

简而言之,您的代码就像(您)设计的那样工作(它)。 :)

我将您的代码下载到我的电脑上,更改了您的代码,我的预期行为正常运作。

将'availableColors列表添加到'Car'

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.rowexpansion;

import java.util.List;

public class Car implements java.io.Serializable {

   private static final long serialVersionUID = 2296448576778208049L;

   private String model;
   private String year;
   private String color;
   private List<Color> availableColors;

   public Car() {
   }

   public Car(String model, String year) {
      super();
      this.model = model;
      this.year = year;
   }

   public String getModel() {
      return model;
   }

   public void setModel(String model) {
      this.model = model;
   }

   public String getYear() {
      return year;
   }

   public void setYear(String year) {
      this.year = year;
   }

   public String getColor() {
      return color;
   }

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

    public List<Color> getAvailableColors() {
        return availableColors;
    }

    public void setAvailableColors(List<Color> availableColors) {
        this.availableColors = availableColors;
    }

}

修改Bean:删除'final'列出availableColors和rowToggler事件,并在bean的构造函数中填充Car.availableColors()

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.rowexpansion;

import java.util.ArrayList;
import java.util.List;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@SessionScoped
public class Bean implements java.io.Serializable {

   private static final long serialVersionUID = 1708652163041196763L;

   private List<Car> carsSmall = new ArrayList<Car>();
   private Color selectedColor;

   public Bean() {
        List<Color> availableColors;
        carsSmall.add(new Car("81025d15", "2011"));
        availableColors = new ArrayList<Color>();
        availableColors.add(new Color("RED"));
        availableColors.add(new Color("GREEN"));
        availableColors.add(new Color("BLUE"));
        carsSmall.get(0).setAvailableColors(availableColors);

        carsSmall.add(new Car("44194657", "2012"));
        availableColors = new ArrayList<Color>();
        availableColors.add(new Color("YELLOW"));
        availableColors.add(new Color("GRAY"));
        availableColors.add(new Color("BLACK"));
        carsSmall.get(1).setAvailableColors(availableColors);

        carsSmall.add(new Car("482f2a60", "2013"));
        availableColors = new ArrayList<Color>();
        availableColors.add(new Color("ORANGE"));
        availableColors.add(new Color("BROWN"));
        availableColors.add(new Color("PINK"));
        carsSmall.get(2).setAvailableColors(availableColors);
   }

   public void chooseColor(){
      System.out.println(this.selectedColor.getColor());
   }

   public List<Car> getCarsSmall() {
      return carsSmall;
   }

   public void setCarsSmall(List<Car> carsSmall) {
      this.carsSmall = carsSmall;
   }

   public Color getSelectedColor() {
      return selectedColor;
   }

   public void setSelectedColor(Color selectedColor) {
      this.selectedColor = selectedColor;
   }

}

从xhtml中删除了rowToggle AJAX事件;不需要它,真的。

<p:ajax event="rowToggle" listener="#{bean.onRowToggle}" />

最后,我将'bean.availableColors'更改为'car.availableColors'

<ui:repeat var="color" value="#{car.availableColors}">
    <p:commandButton action="#{bean.chooseColor}" value="#{color.color}">
        <f:setPropertyActionListener target="#{bean.selectedColor}" value="#{color}" />
     </p:commandButton>
</ui:repeat>