Button with Spinner/Progress Indicator
In this blog I will be explaining, how to show a Button with Spinner/Progress Indicator in Oracle APEX. In Oracle APEX, by default the spinner will be displayed on the page but in one of my requirements I had to display the spinner in a button instead of displaying it in the page. So I followed the below steps to achieve it. 1) Create a Region in the page, 2) Create a Button in the region. (In this example: P37_PROGRESS_BUTTON ) 3) Add the class custom-button-spinner in the Appearance -> CSS Classes section of the button. 4) Add the below code in the Execute When Page Loads section of the page. $(document).on("click",".t-Button.custom-button-spinner",function(){ $element = $(this); $element.addClass("apex_disabled"); $element.find(".t-Button-label").append('<span aria-hidden="true" class="fa-spinner fa fa-anim-spin margin-left-sm js-custom-spinner"></span>'); }); Note: The above