如何在JSF Datatable中生成动态列? [英] How to generate dynamic columns in JSF Datatable?

查看:145
本文介绍了如何在JSF Datatable中生成动态列?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

希望具有以下数据表结构:

Would like to have following data table structure:

+--------------------------------------------------------------+
|       dynamic      |       dynamic      |      dynamic       |
|--------------------------------------------------------------|
| col1 | col2 | col3 | col1 | col2 | col3 | col1 | col2 | col3 |     
|--------------------------------------------------------------|
| data | data | data | data | data | data | data | data | data |

原因是,在我请求数据库之前,我不知道必须显示多少列. col1,col2,col3中的列始终相同.

The reason for that is, that i don't know how much columns have to be displayed until i request a database. The columns in col1, col2, col3 are always the same.

我尝试了以下数据表:

<h:form id="form">    
        <h:panelGrid columns="3" style="margin:10px 0">
            <p:outputLabel for="template" value="Adid:" style="font-weight:bold"/>
            <p:inputText id="template" value="#{reportingView.adId}" size="50"/>
            <p:commandButton update="kpi_table" actionListener="#{reportingView.updateColumns}" value="Create Data" process="@parent" icon="ui-icon-refresh" oncomplete="PF('carsTable').clearFilters()"/>
        </h:panelGrid>

        <p:dataTable id="reportingTable" var="pi" value="#{reportingView.indicators}" widgetVar="indicatorTable" filteredValue="#{reportingView.filteredValues}">                    
            <p:columns value="#{reportingView.columns}" var="column" columnIndexVar="colIndex" sortBy="#{pi[column.property]}" >
                <f:facet name="header">
                    <h:outputText value="#{column.header}" />
                </f:facet>

                <p:columnGroup type="header">
                    <p:row>
                        <p:column headerText="1" />
                        <p:column headerText="2" />
                        <p:column headerText="3" />
                    </p:row>
                </p:columnGroup>


            </p:columns>
        </p:dataTable>
    </h:form>

但是,正如您可以想象的那样,它将无法正常工作-columnGroup似乎被忽略了. 我建议不可能将动态结构与静态列结合在一起.有人解决过类似的问题吗?

But, as you can imagine, it won't work - the columnGroup seems to be ignored. I suggest that a it isn't possible to combine a dynamic structure with static columns. Did anyone solve a similar problem?

非常感谢

推荐答案

JSF具有Value bindingComponent binding.通常,我们使用value binding. 根据我的经验,我使用Component binding生成动态组件并通过程序进行控制. (例如:像你一样.)

JSF have Value binding and Component binding. Normally, we use value binding. For my experience, I use Component binding to generate dynamic component and to control by program. (Eg : Like you).

绑定"属性在JSF中如何工作?

How does the 'binding' attribute work in JSF?

您的问题,请检查并尝试以下示例程序.

For your question, Check and try the following example program.

MockDb.java

MockDb.java

它是标题和子标题的数据.可能来自数据库.

It is data for header and sub-header. It might be come form Database.

import java.util.ArrayList;
import java.util.List;

public class MockDb {
    public static List<Header> getHeaderList() {
        List<Header> headerList = new ArrayList<Header>();

        List<SubCol> subColList_1 = new ArrayList<SubCol>();
        subColList_1.add(new SubCol("Col 1", "Data 1"));
        subColList_1.add(new SubCol("Col 2", "Data 2"));
        subColList_1.add(new SubCol("Col 3", "Data 3"));
        headerList.add(new Header("Header 1", subColList_1));

        List<SubCol> subColList_2 = new ArrayList<SubCol>();
        subColList_2.add(new SubCol("Col 1", "Data 1"));
        subColList_2.add(new SubCol("Col 2", "Data 2"));
        subColList_2.add(new SubCol("Col 3", "Data 3"));
        headerList.add(new Header("Header 2", subColList_2));


        List<SubCol> subColList_3 = new ArrayList<SubCol>();
        subColList_3.add(new SubCol("Col 1", "Data 1"));
        subColList_3.add(new SubCol("Col 2", "Data 2"));
        subColList_3.add(new SubCol("Col 3", "Data 3"));
        subColList_3.add(new SubCol("Col 4", "Data 4"));
        headerList.add(new Header("Header 3", subColList_3));


        List<SubCol> subColList_4 = new ArrayList<SubCol>();
        subColList_4.add(new SubCol("Col 1", "Data 1"));
        subColList_4.add(new SubCol("Col 2", "Data 2"));
        subColList_4.add(new SubCol("Col 3", "Data 3"));
        subColList_4.add(new SubCol("Col 4", "Data 4"));
        subColList_4.add(new SubCol("Col 5", "Data 5"));
        headerList.add(new Header("Header 4", subColList_4));

        return headerList;
    }

    public static List<DataValue> getValueList() {
        /*Create 5 rows for data array for 15 columns*/
        List<DataValue> valueList = new ArrayList<DataValue>();
        for(int i=1; i <=5; i++) {
            DataValue data = new DataValue("1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15");
            valueList.add(data);
        }
        return valueList;
    }
}

Header.java

Header.java

public class Header {
    private String name;
    private List<SubCol> subColList;

    public Header(){
    }

    public Header(String name, List<SubCol> subColList) {
        this.name = name;
        this.subColList = subColList;
    }
    //getter & setter
}

SubCol.java

SubCol.java

public class SubCol {
    private String name;
    private String data;

    public SubCol() {
    }

    public SubCol(String name, String data) {
        this.name = name;
        this.data = data;
    }   
    //getter & setter
}

DataValue.java

DataValue.java

public class DataValue {
    private String data1;
    private String data2;
    private String data3;
    private String data4;
    private String data5;
    private String data6;
    private String data7;
    private String data8;
    private String data9;
    private String data10;
    private String data11;
    private String data12;
    private String data13;
    private String data14;
    private String data15;

    public DataValue(){
    }

    public DataValue(String data1, String data2, String data3, String data4, String data5, String data6, String data7,
            String data8, String data9, String data10, String data11, String data12, String data13, String data14,
            String data15) {
        this.data1 = data1;
        this.data2 = data2;
        this.data3 = data3;
        this.data4 = data4;
        this.data5 = data5;
        this.data6 = data6;
        this.data7 = data7;
        this.data8 = data8;
        this.data9 = data9;
        this.data10 = data10;
        this.data11 = data11;
        this.data12 = data12;
        this.data13 = data13;
        this.data14 = data14;
        this.data15 = data15;
    }
    //getter & Setter
}

DynamicColumnBean.java

DynamicColumnBean.java

import java.util.List;

import javax.annotation.PostConstruct;
import javax.el.ELContext;
import javax.el.ExpressionFactory;
import javax.el.ValueExpression;
import javax.faces.application.Application;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.component.html.HtmlOutputText;
import javax.faces.context.FacesContext;

import org.primefaces.component.column.Column;
import org.primefaces.component.columngroup.ColumnGroup;
import org.primefaces.component.datatable.DataTable;
import org.primefaces.component.row.Row;

import com.kbzmai.skyfly.common.Header;
import com.kbzmai.skyfly.common.MockDb;
import com.kbzmai.skyfly.common.SubCol;

@ManagedBean(name = "DynamicColumnBean")
@ViewScoped
public class DynamicColumnBean {

    private DataTable myDataTable;

    public DataTable getMyDataTable() {
        return myDataTable;
    }

    public void setMyDataTable(DataTable myDataTable) {
        this.myDataTable = myDataTable;
    }

    @PostConstruct
    public void init() {
        myDataTable = new DataTable();
        myDataTable.setValue(MockDb.getValueList());
        myDataTable.setVar("mydata");

        ColumnGroup columnGroup = new ColumnGroup();
        myDataTable.getChildren().add(columnGroup);
        columnGroup.setType("header");
        List<Header> headerList = MockDb.getHeaderList();

        /*Create Column for Header*/        
        Row headerRow = new Row();
        columnGroup.getChildren().add(headerRow);
        for(Header header : headerList) {
            Column column = new Column();
            /*Make sure to set column span*/
            column.setColspan(header.getSubColList().size());
            headerRow.getChildren().add(column);
            column.setHeaderText(header.getName());
        }

        FacesContext fc = FacesContext.getCurrentInstance();
        Application application = fc.getApplication();
        ExpressionFactory ef = application.getExpressionFactory();
        ELContext elc = fc.getELContext();

        /*Create Column for Sub Column of current header*/      
        Row subColRow = new Row();
        columnGroup.getChildren().add(subColRow);
        for(Header header : headerList) {
            for(SubCol subCol : header.getSubColList()) {
                Column column = new Column();
                subColRow.getChildren().add(column);
                column.setHeaderText(subCol.getName());
            }
        }

        /*Create data row for 15 columns*/      
        for(int i=1; i <= 15; i++) {
            ValueExpression valueExp = ef.createValueExpression(elc, "#{mydata.data" + i + "}", Object.class);
            HtmlOutputText output = (HtmlOutputText)application.createComponent(HtmlOutputText.COMPONENT_TYPE );
            output.setValueExpression("value", valueExp);
            Column dataColumn = new Column();
            dataColumn.getChildren().add(output);
            myDataTable.getChildren().add(dataColumn);
        }
    }
}

dynamicColumnTest.xhtml

dynamicColumnTest.xhtml

<p:dataTable binding="#{DynamicColumnBean.myDataTable}"/>       

结果:

这篇关于如何在JSF Datatable中生成动态列?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆