Checkbox Item check / uncheck all
If you have an ordinary checkbox item based on a list of values, here is a function which will set all the values to checked or unchecked:
function checkboxSetAll (item,checked) {
$("#"+item+" input[type=checkbox]").attr('checked',checked);
$("#"+item).trigger("change");
}
For example:
checkboxSetAll("P1_ITEM", true); //select all
checkboxSetAll("P1_ITEM", false); //select none
It works this way because a checkbox item based on a LOV is generated as a set of checkbox input items within a fieldset.
Note: If it’s a checkbox column in a report, you can use this trick instead: Select All / Unselect All Checkbox in Interactive Report Header
About Jeffrey Kemp
Application Designer & Developer at Oracle specialising in Oracle APEX (Application Express), Oracle SQL and PL/SQL. Oracle ACE Alumni ♠️. Piano player, father, husband, Christian. The views expressed on this blog are my own and do not necessarily reflect the views of Oracle.
Marco
8 July 2020 - 8:59 pm
Hi Jeffrey,
I was very happy when I ran into this article, since it was exactly what I was looking for.
I have added the function on the page in “Function and Global Variable Declaration”.
Then I have created 2 buttons:
– 1 to “Select All”
– and 1 for “Select None”
Both buttons call the appropriate functionusing a DA.
When I click “Select All”, the checkboxes are all selected.
Then when I click “Select None” all boxes are unchecked.
However when I click “Select All” again, nothing happens.
Do you have an idea why this is and, even better, how I should resolve this?
Muahammad Zakria
17 February 2021 - 3:51 pm
Hi Jeffrey,
how to keep checkbox checked even after page refresh in this scenerio please help.
Thankyou
Jeffrey Kemp
17 February 2021 - 4:07 pm
Hi Muahammad,
Good question, and the answer is not simple. There are a few ways you might do this – the key thing being that you need to somehow store the state of each checkbox before the page is refreshed, and restore the state after the page has been re-rendered on the client.
The question you’ll need to think about is where to store the state?
1. Store it on the client, e.g. using localStorage to store the selected record IDs (this will be the fastest, but when the user goes to a different browser or device the selection will be lost)
2. Store it on the server in the session state, e.g. using a dynamic action calling PL/SQL that stores the selected IDs in an APEX collection (this will be slower)
3. Store it on the server in a database table, e.g. using a dynamic action calling SQL to insert the selected IDs in a table (this will also be slow, but will save the user’s selection across browsers and devices)
You would need a dynamic action that listens to changes to the checkboxes and stores or removes the selected IDs from the data store, and a step on Page Load that restores the state and re-selects the checkboxes the user had checked. I would prefer method #1 mainly due to the performance aspect.
Providing a full example on how to implement this is beyond the scope of a simple comment on this post, however – but I hope this gives you some helpful ideas.
Jeff
Mark Lancaster
1 November 2021 - 3:52 pm
I had the same issue as Marco.
After reading https://api.jquery.com/prop/#prop-propertyName which describes the difference between attr() and prop() I would use prop() instead.
i.e.
function checkboxSetAll (item,checked) {
$(“#”+item+” input[type=checkbox]”).prop(“checked”, checked);
$(“#”+item).trigger(“change”);
}
This fixes the “only works the first time” behaviour.