简体   繁体   English

选择数据表中的所有 jsf primefaces

[英]select all in datatable jsf primefaces

Im trying to create a select all button or check box that when clicked all the selectbooleanCheck boxes will be checked.我试图创建一个全选按钮或复选框,当单击所有 selectbooleanCheck 框时将被选中。 is there no straight forward easy way.ive started creating the selectcheckbox that will when changed selectAll.有没有直接简单的方法。我开始创建选择复选框,当更改为全选时。 thanks谢谢

 <p:dataTable value="#{illRequestModel.list}"  
                        var="illRequestRecord" width="100%" styleClass="request-table"
                        rows="10" paginator="true" id="requestGrid" 
                        currentPageReportTemplate="Viewing Page {currentPage}"
                        paginatorTemplate="{CurrentPageReport}   {PageLinks}  "
                        paginatorPosition="bottom">
                        <p:column >
                        <f:facet name="header">
                                <h:selectBooleanCheckbox id="checkbox2" title="emailUpdates2" onchange="CheckAll()" > 

                                </h:selectBooleanCheckbox>
                            </f:facet>
                            <h:selectBooleanCheckbox id="checkbox" title="emailUpdates"
                                value="#{illRequestRecord.selected}"
                                onchange="addNumber(#{illRequestRecord.localRequestId})"> 
                                <f:ajax listener="#{illRequestRecord.selectmethod}" />
                                </h:selectBooleanCheckbox>
                        </p:column>
                        <p:column id="localRequestIdCol"
                            sortBy="#{illRequestRecord.localRequestId}">
                            <f:facet name="header">
                                <h:outputText value="ID" />
                            </f:facet>
                            <h:commandLink value="#{illRequestRecord.localRequestId}"
                                action="#{requestListController.displaySingleRecord}">
                                <f:param name="selectedItemId"
                                    value="#{illRequestRecord.localRequestId}"></f:param>
                            </h:commandLink>
                        </p:column>

Why don't you use the same multi-selection datatable used in the PrimeFaces DataTable showcase As you can see in:你为什么不使用相同的多重选择datatable中使用PrimeFaces DataTable中展示正如你可以看到在:

 <p:dataTable id="multiCars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10" selection="#{tableBean.selectedCars}">

It will automatically add a check-all functionality.它将自动添加检查所有功能。 In case you want an external checkbox to check all, you can do the following.如果您希望外部复选框选中所有内容,您可以执行以下操作。 Give a widgetVar to you datatable, let's call it dataTableWV为您的数据widgetVar提供一个widgetVar ,我们称之为dataTableWV

 <p:dataTable widgetVar="dataTableWV" id="multiCars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10" selection="#{tableBean.selectedCars}">  

And you have a checkbox:你有一个复选框:

 <input id="checkAll" type="checkbox" />

You can register a click event on it like the next:您可以在其上注册一个点击事件,如下所示:

 <script>
      $(document).ready(function() {
          $('#checkAll').on('click', function() {
               //selects all records on the displayed page if pagination is supported.
               dataTableWV.selectAllRowsOnPage();

               //or you can select all the rows across all pages.
               dataTableWV.selectAllRows();
          });
      });
 </script>
<p:dataTable widgetVar="dataTableWV" id="multiCars" var="car" value="#{tableBean.mediumCarsModel}" paginator="true" rows="10" selection="#{tableBean.selectedCars}">
  <f:facet name="header">
      <p:commandButton value="select" onclick="PF('dataTableWV').selectAllRows()" />
      <p:commandButton value="unselect" onclick="PF('dataTableWV').unselectAllRows()" />
  </f:facet>
</p:dataTable>
Sample Code:-

**JAVA (your backing bean class)
==============================**
//Stores the checked items from data table.
private List<String> selectedIds = new ArrayList<>();

private List<String> getSomeList() {
// return list of strings to data table
  return someList;
}

public void selectAllCheckboxes(ToggleSelectEvent event) {
if (selectedIds != null)  {
    selectedIds.clear();
    if (event.isSelected()) {
        selectedIds.addAll(someList); //Add all the elements from getSomeList()
    }
 }
}

**XHTML
=====**

<p:dataTable id="data-table-id" value="#{backingBean.someList}"
selection="#{backingBean.selectedIds}" rowKey="#{id}" var="id"                   
paginator="true" rows="10" paginatorPosition="bottom"
paginatorAlwaysVisible="false" rowSelectMode="checkbox"
rowsPerPageTemplate="10,20,30,50">

<p:column selectionMode="multiple" />
<p:ajax event="toggleSelect" 
update="@this"listener="#backingBean.selectAllCheckboxes}"/>

</p:dataTable>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM