Tuesday, February 12, 2013

Checkbox in tabular form column header

Some javascript code to add a checkbox in the header(s) of a tabular form, which will check/uncheck all checkboxes in a column.
/**
  * Adds a checkbox in the column header of the column identified by pColumnHeader
  * Checking and unchecking this checkbox will check or uncheck all visible 
  * checkboxes in the column
 **/
function addHeaderCheckbox(pColumnHeader){
   $("<input type='checkbox' id='"+pColumnHeader+"_chk_all_rows' />")
   .bind("click", function(){
      $("td[headers='"+pColumnHeader+"'] input[type='checkbox']:visible")
      .prop("checked", $(this).prop('checked'));
   })
   .prependTo("th#"+pColumnHeader+"");
};
Example situation:
Tabular form based on SQL:
select 
"EMPNO",
"EMPNO" EMPNO_DISPLAY,
"ENAME",
"HIREDATE",
"SAL",
"DEPTNO",
NULL checkme
from "#OWNER#"."EMP"
Where the CHECKME column is displayed as a "Simple Checkbox", values "Y,"
Since the headers are also replaced when the region is refreshed or paginated, the checkbox will have to be added to the form after each refresh. Dynamic action, "After refresh", on tabular form region.
As true action select "Execute Javascript Code", and make sure to check "Fire on Page Load".
addHeaderCheckbox("CHECKME");
As discussed in OTN thead all Check box check / uncheck in tabular form.

No comments:

Post a Comment