Richface Datatable with Checkbox Column and an CheckAll Checkbox in Header
<rich:extendedDataTable value="#{myBean.entries}" var="entry" id="IdList" width="580px" height="400px" sortMode="single"
selectionMode="multi" selection="#{myBean.selectedEntries}">
<rich:column align="center" width="150px">
<f:facet name="header">
<h:panelGroup style="width:150px;" layout="block">
<script type="text/javascript">
//<![CDATA[
function checkAllCheckboxesInTable( inputId, state ){
var commonIdPart = inputId.substr(0, inputId.lastIndexOf(':'));
var tableId = commonIdPart + ':tu'
var tableElement = document.getElementById( tableId );
var inputs = tableElement.getElementsByTagName('input');
for (var i = 0; i <= inputs.length; i++){
var input = inputs[i];
if( input.getAttribute('type') == 'checkbox' && state){
input.setAttribute('checked', state);
}else{
input.removeAttribute('checked');
}
}
}
//]]>
</script>
<h:selectBooleanCheckbox id="checkAll" title="#{bundle.CHECK_ALL}" onclick="checkAllCheckboxesInTable( this.id, this.checked );">
<a4j:support event="onchange" reRender="IdList"/>
</h:selectBooleanCheckbox>
<h:outputText value="#{bundle.IDENTITY_CHECKBOX_SELECT_ALL}"/>
</h:panelGroup>
</f:facet>
<h:selectBooleanCheckbox id="checkEntry" value="#{entry.selected}" disabled="false"/>
</rich:column>
<rich:column sortable="true" sortBy="#{entry.name}" filterBy="#{entry.name}" filterEvent="onkeyup" width="170px" label="Name">
<f:facet name="header">
<h:outputText value="Name"/>
</f:facet>
<h:outputText value="#{entry.name}"/>
</rich:column>
</rich:extendedDataTable>
"checkAll" Checkbox call a javascript function with two parameters, the ID and the checked of the actual input-element. The Javascript function, build the id of the Table-Element. Same as the checkAll element but after the last ":" are "tu" not "checkAll". If the extendedDataTable has an own ID, so i thing the table-element-id ends with the own ID of the richfaces:extendedDataTable (i don't try this).
But warning: the Javascript set all checkboxes in Table als checked/unchecked. If you have more than one Column with checkboxes you can uses the ID of the h:selectBooleanCheckbox to differ.
Comments