Hi,
Under APEX 24.2.0 I folowed this post form @jariola :
https://cloud.jaris.fi/ords/r/jaris/blog/post?p2_post_id=20220406135639638575
But it does not work? Control breaks are not collpased. Where is my error ?
let lButton = apex.util.htmlBuilder()
// Get messages for button title. Reusing IG messages
, lCollapseTitle = apex.lang.getMessage( "APEX.GV.BREAK_COLLAPSE" )
, lExpandTitle = apex.lang.getMessage( "APEX.GV.BREAK_EXPAND" )
// Button icon classes for collapse and expand
, lBtnIcons = [ "fa-chevron-down", "fa-chevron-right" ]
// IR control break row jQuery selector
, lCtrBreak = "th.a-IRR-header--group"
;
// Prepare button HTML
lButton.markup( "<button" )
.attr( "type", "button" )
.attr( "aria-expanded", "true" )
.attr( "title", lCollapseTitle )
.attr( "aria-label", lCollapseTitle )
.attr( "class", "t-Button t-Button--noLabel t-Button--icon t-Button--small t-Button--gapRight" )
.markup( "><span" )
.attr( "aria-hidden", "true" )
.attr( "class", "t-Icon fa " + lBtnIcons[0] )
.markup( "></span></button>" )
;
// Set click event to button
let button$ = $( lButton.toString() ).click( function(){
let this$ = $( this )
, lExpanded = this$.attr( "aria-expanded" ) === "true" ? "false" : "true"
, lNewTitle = lExpanded === "true" ? lCollapseTitle : lExpandTitle
;
// Change button attributes and icon
this$.attr({
"title": lNewTitle
, "aria-label": lNewTitle
, "aria-expanded": lExpanded
}).children().toggleClass( lBtnIcons ).end()
// Hide/show IR rows from row clicked to the next control break
.closest( "tr" ).nextUntil( ":has(" + lCtrBreak + ")" ).toggle()
;
});
// Attach button to IR control break rows
$( this.triggeringElement ).find( lCtrBreak ).prepend( button$ )
// Uncomment below line to initiallyt collapse control breaks.
// Remember also change button initial attributes.
// .closest( "tr" ).nextUntil( ":has(" + lCtrBreak + ")" ).toggle()
;
Best regards.