h:dataTable JSF PRIMEFACES 动态列 添加列 动态创建数据表 





@Named
@ViewScoped
public class LiveRangeService implements Serializable {
    private List< Map<String, ColumnModel> > tableData;
    private List<ColumnModel> tableHeaderNames;


    public List<Map<String, ColumnModel>> getTableData() {
        return tableData;
    }
    public List<ColumnModel> getTableHeaderNames() {
        return tableHeaderNames;
    }

    public void PlayListMB() {
        tableData = new ArrayList< Map<String, ColumnModel> >();

        //Generate table header.
        tableHeaderNames = new ArrayList<ColumnModel>();
        for (int j = 0; j < 5; j++) {
              tableHeaderNames.add(new ColumnModel("header "+j, " col:"+ String.valueOf(j+1)));
        }

        //Generate table data.
        for (int i = 0; i < 10; i++) {
            Map<String, ColumnModel> playlist = new HashMap<String, ColumnModel>();
            for (int j = 0; j < 5; j++) {
                playlist.put(tableHeaderNames.get(j).key,new ColumnModel(tableHeaderNames.get(j).key,"row:" + String.valueOf(i+1) +" col:"+ String.valueOf(j+1)));
            }
            tableData.add(playlist);
        }
    }

    static public class ColumnModel implements Serializable {

        private String key;
        private String value;

        public ColumnModel(String key, String value) {
            this.key = key;
            this.value = value;
        }

        public String getKey() {
            return key;
        }

        public String getValue() {
            return value;
        }
    }


 



<h:form>

                    <p:dataTable id="tbl" var="result"
                        value="#{liveRangeService.tableData}"
                        rendered="#{not empty liveRangeService.tableData}"
                        rowIndexVar="rowIndex"
                        >

                        <f:facet name="header">  header table </f:facet>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="序号" />
                            </f:facet>
                            <h:outputText value="#{rowIndex+1}" />
                        </p:column>

                        <p:columns value="#{liveRangeService.tableHeaderNames}"
                            var="mycolHeader" columnIndexVar="colIndex">
                            <f:facet name="header">
                                <h:outputText value="#{mycolHeader.value}" />

                            </f:facet>
                            <h:outputText value="#{result[mycolHeader.key].value}" />
                            <br />
                        </p:columns>

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


 

使用primefaces实现。需要一个表header的list，里面存放列的标题。数据存放在map里面，key是标题，value是值即可。使用自定义的ColumnModel类，是为了把标题和数据用key对应起来，真正的标题内容可以设定。
官方的示例：
http://www.primefaces.org/showcase/ui/data/datatable/columns.xhtml


 ------------------------------------------------------------------------------------------------

表头也可以直接写好，以后直接columns写入每列值就行。但是不写头，最后导出excel就没有头了。



<h:form>

                        <p:dataTable id="tbl" var="result"
                            value="#{liveRangeService.tableData}"
                            rendered="#{not empty liveRangeService.tableData}"
                            rowIndexVar="rowIndex"
                            paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {Exporters}"
                            paginator="true" style="margin-bottom:20px">
                            <f:facet name="{Exporters}">
                                <h:commandButton id="exportcvs" value="导出表格"
                                    class="btn btn-default">
                                    <p:dataExporter type="xls" target="tbl"
                                        fileName="#{liveRangeService.filename}" />
                                </h:commandButton>
                            </f:facet>
                            <f:facet name="header">  header table </f:facet>


                            <p:columnGroup type="header">
                                <p:row>
                                    <p:column rowspan="2" headerText="Player" />
                                    <p:column colspan="2" headerText="users" />
                                </p:row>
                                <p:row>
                                    <p:column headerText="number" />
                                    <p:column headerText="percent" />
                                </p:row>
                            </p:columnGroup>


                            <p:column>
                                <h:outputText value="my name" />
                            </p:column>



                            <p:columns value="#{liveRangeService.tableHeaderNames}"
                                var="mycolHeader" columnIndexVar="colIndex">

                                <h:outputText value="#{result[mycolHeader.key].value}" />
                                <br />
                            </p:columns>

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