仅在（Primefaces）dataTable的第一行上获取inputText，其中包含动态列和行 [英] getting inputText on only the first row of a (Primefaces) dataTable, with dynamic columns and rows

问题描述

我有一个带有动态列和动态行的Primefaces（5.0）数据表。
简而言之，我的问题是如何设置它，以使第一行的单元格是一系列inputText或inputTextarea，而第一行下方的行是outputText？

详细说明一下，xhtml（在BalusC对

我想要的是第一行InputTextarea的一行，因此用户可以根据其下面各行的内容在每个第一行单元格中添加注释。我已经在视觉上实现了它-但如上所述，它不能正常工作，因为inputTextareas（我想是因为它们位于构面中）没有被插入rowMap和columnName迭代中

我看过了primefaces可编辑数据表（ http ：//www.primefaces.org/showcase/ui/data/datatable/edit.xhtml ）-大致符合要求。但是，它使所有行都是可编辑的，而不仅仅是第一行。在这种情况下，列和行都将被动态应用。

任何评论或帮助都值得赞赏。谢谢。

解决方案

由于您询问只希望第一行是可编辑的，因此我要求您使用rowIndexVar来管理行

您可以使用p：dataTable的rowIndexVar属性。

rowIndexVar 是引用每个行索引的迭代器的名称。

其迭代器名称可用于EL中以获取行ID

例如：如果rowIndexVar = row，则可以使用＃{row}在EL中使用该迭代器名称访问每一行索引。

示例代码：

 < p：dataTable rowIndexVar = row value =。 .. var = myVar> 
< p：column> 
< p：inputTextarea rows = 2 cols = 25 counter = display 
 value =＃{myVar.myText} rendering =＃{row == 0} id = comment1 
 maxlength = 200 
 counterTemplate = {0}剩余字符 
 autoResize = false> 
< / p：inputTextarea> 
< h：outputText值=＃{myVar.myText}渲染=＃{row！= 0} /> 
< / p：列> 
 .... 
< / p：dataTable> 
  

I have a Primefaces (5.0) Datatable with dynamic columns as well as dynamic rows. In brief, my problem is how do I set it up so that the cells of the first row are a series of inputText's or inputTextarea's, while the rows below the first are outputText?

To elaborate, the xhtml (following BalusC's response to Creating and populating a DataTable dynamically in JSF2.0) is as follows:

<p:dataTable var="rowMap" value="#{reviewController.rowMapList}" scrollable="true" scrollWidth="900px"  >
            <p:columns value="#{reviewController.columnNameList}" var="columnName" headerText="#{columnName}">
                <f:facet name="header" >#{columnName}</f:facet>
                <f:facet name="header"><p:inputTextarea  value="#{rowMap[columnName]}"  /></f:facet>
                <h:outputText value="#{rowMap[columnName]}"  />
            </p:columns>
        </p:dataTable> 

So I'm thinking, likely there is a problem in using facets for the row with the inputTexts, because the facet doesn't seem to take part in the dataTable data iteration. So how do I put the first row in as a "normal" row (rather than a facet if that is part of the problem) -- but still apply inputTextarea's to that first row, without applying inputTextareas to all the rows?

For the purposes of getting it working, I've set it up statically with a @PostConstruct on reviewController, as follows.

@Named
@ViewScoped
public class ReviewController implements Serializable {

private List<String> columnNameList;
private ArrayList<Map<String, Object>> rowMapList;
private Map<String, Object> rowMap;

@PostConstruct
public void init() {
     columnNameList = new ArrayList<>();
     rowMapList = new ArrayList<>();

     columnNameList.add("Source Report");
     columnNameList.add("Overview");
     columnNameList.add("Question 1");
     columnNameList.add("Question 2");
     columnNameList.add("Question 3");

     Map<String, Object> m = new HashMap<>();
     m.put(columnNameList.get(0), "Assessor1");
     m.put(columnNameList.get(1), "Assessor1 overview text");
     m.put(columnNameList.get(2), "Assessor1 comment on Q1");
     m.put(columnNameList.get(3), "Assessor1 comment on Q2");
     m.put(columnNameList.get(4), "Assessor1 comment on Q3");
     rowMapList.add(m);
     m = new HashMap<>();
     m.put(columnNameList.get(0), "Assessor2");
     m.put(columnNameList.get(1), "Assessor2 overview text");
     m.put(columnNameList.get(2), "Assessor2 comment on Q1");
     m.put(columnNameList.get(3), "Assessor2 comment on Q2");
     m.put(columnNameList.get(4), "Assessor2 comment on Q3");
     rowMapList.add(m);
     //etc
}

Visually it turns out like this:

What I want is to have the first row being a row of InputTextarea's, so the user can add comments in each first row cell in response to the content of the rows beneath it. I've achieved it visually - but as I remark above, it doesn't work in that the inputTextareas (I presume because they're in facets) are not hooked into the rowMap and columnName iterations

I have looked at the primefaces editable datatable (http://www.primefaces.org/showcase/ui/data/datatable/edit.xhtml) - which is somewhat along the lines of what is required. However it makes all rows editable, not just the first. There is the further complexity in this case that both columns and rows will be dynamically applied.

Any comment or assistance appreciated. Thanks.

解决方案

Since you asked you want only the 1st row is editable, I have asked you to use rowIndexVar to manage the rows.

You can use p:dataTable's rowIndexVar attribute.

rowIndexVar is Name of iterator to refer each row index.

Whose iterator name can be used in EL to get the Row Id

For example: if rowIndexVar="row" then you can access each row Index using that iterator name in EL using #{row}.

Example Code:

<p:dataTable rowIndexVar="row" value="..." var="myVar">
    <p:column>
       <p:inputTextarea rows="2" cols="25" counter="display"
                            value="#{myVar.myText}" rendered="#{row==0}"                       id="comment1"
                            maxlength="200"
                            counterTemplate="{0} remaining characters"
                            autoResize="false">
                        </p:inputTextarea>
        <h:outputText value="#{myVar.myText}" rendered="#{row!=0}" />
    </p:column>
    ....
</p:dataTable>

这篇关于仅在（Primefaces）dataTable的第一行上获取inputText，其中包含动态列和行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！