Question

我有以下数据：

<rich:dataTable id="grid1" value="#{monitorForm.customerList}" var="custRow">
 <rich:column width="5">
  <h:selectBooleanCheckbox value="#{custRow.selected}">
   <a:support event="onclick" action="#{monitorForm.selectOrderLines(custRow)}" 
      reRender="custTable_#{custRow.id}"/>
  </h:selectBooleanCheckbox>
 </rich:column>

 <rich:subTable id="custTable_#{custRow.id}"
      var="row" value="#{custRow.orderList}" rendered="#{custRow.show}">
<rich:column width="5">
 <h:selectBooleanCheckbox value="#{row.checked}" />
</rich:column>

    <rich:column>
 <h:outputText value="#{row.name}" />
</rich:column>
 </rich:subTable>

</rich:dataTable>

当我点击复选框时，操作#{monitorForm.selectOrderLines(custRow)} 设置所选客户的复选框，我只想重新获得该客户的子表。以上不起作用。

错误[AjaxContext] Target component for id custTable_<id number>不存在。

使用reRender="grid1"时，一切正常但是当行数很多时，这可能会很慢。

是否可以使rich:subTable具有动态ID，我只能用于重新调整该子表？

Answer 1

我现在使用的解决方法是：

<rich:dataTable id="grid1" value="#{monitorForm.customerList}">
  <rich:column width="5">
    <h:selectBooleanCheckbox value="" onclick="selectAllPackingLists(this, '#{custRow.id}')"/>
  </rich:column>  

<rich:subTable var="row" value="#{custRow.orderList}" rendered="#{custRow.show}">
    <rich:column>
      <input type='hidden' value='#{custRow.id}'/>
    </rich:column>

<rich:column width="5">
 <h:selectBooleanCheckbox value="#{row.checked}" />
</rich:column>

</rich:subTable>

</rich:dataTable>

javascript函数：

                function selectAllPackingLists(o, id) {
                    var elem = jQuery("table[id='monitorFrm:grid1'] > tbody");
                    var checked = o.checked;

                    var rows = elem.attr('rows');

                    jQuery.each(rows, function(index, row) {
                            // for each row check if the input value in 1st column
                            // matches the selected customer id
                        var td = jQuery('td:first', this);
                        var hiddenFld = jQuery('input:first', td);

                        if (hiddenFld.val() == id) {
                                  // set the checkbox in the 2nd column to true 
                            var td2 = jQuery('td:nth-child(2)', this);
                            var cb = jQuery('input:first', td2);

                            jQuery(cb).attr('checked', checked);
                        }
                    });
                }

最棒的是，通过JQuery设置复选框还会为每个对应的<h:selectBooleanCheckbox value="#{row.checked}" />设置bean中的值

我不知道它会那样做。

Answer 2

您可以尝试设置subTable id="custTable"并执行reRender="custTable"，看看它是否适合您。

richfaces数据表和子表

2 个答案: