Skip to Main Content
Feature Request FR-2106
Product Area Developer Experience
Status DELIVERED

97 Voters

Option to Disable Button after clicking to submit

paulo künzel Public
· Oct 21 2021

Idea Summary
Create an option to disable or stop a form being submitted multiple times when the user double clicks a button or the web is a bit slow to send the submitted form

Use Case
Anywhere

Preferred Solution
Add an option right below the action → submit page  configuration and a global default option

Currently, through JavaScript, I inject a code that disable the event target before submiting. To avoid the issue of having a disabled button in case of a process error or something, I've added a settimeout that enable it back after 3 seconds.

This has been delivered in Oracle APEX 24.1!

Known Duplicates

Comments

Comments

  • bshumway OP 3.7 years ago

    Well you can set “enable duplicate page submissions” on the page level to false. Thus disallowing the user from submitting the page twice. Have you considered using that instead?

  • jayson hanes Admin OP 3.7 years ago

    @bshumway, but that's fairly ugly for the UX.

  • paulo künzel OP 3.7 years ago

    @bshumway, Thanks for the suggestion. Still I need the user to be able to post the page more than once. What can't happen is for the double click on a button to cause the attempt to process that specific request again.

  • s.koell OP 3.5 years ago

    @paulo.kunzel139
    The solution for me: Changing the button behavior from „submit“ to „defined by DA“ which then does submit.
    It’s strange but both have different outcomes. The submit in the DA does a modal which prevents the user from clicking again.

    But it's a huge bug in my opinion (not testet in latest version)

  • paulo künzel OP 3.4 years ago

    Hi @s.koell,

    Yeah, we have being doing that for the same reason. I was planning to inject a default submit in the apex library but changed to a less drastic approach.

  • jonatasgomes OP 3.3 years ago (edited 2.8 years ago)

    That's a really nice feature to have as built in. What I am doing for now is to have a DA with JS similar to:

    if (document.button_clicked === undefined) {
      document.button_clicked = ‘Y’';
      // optional → apex.event.trigger(document, ‘custom-event-disable-button’');
      apex.page.submit…;
    }
    
  • nicolas pilot OP 3.2 years ago

    Yes yes yes

    For now, we have create a custom namespace "gcc" with several util functions.
    for example:

    var gcc = (function () {
    
      return {
      
     	
    	//-------------------------------------------------------
        // wrapper for apex.confirm
        //-------------------------------------------------------
    	confirm:function(p_message, p_request, p_show_wait = true){
            apex.confirm(p_message, {request:p_request, showWait:p_show_wait});
    	},	
    	
    	//-------------------------------------------------------
        // wrapper for apex.submit
        //-------------------------------------------------------
    	submit:function(p_request, p_show_wait = true){
            apex.submit({request:p_request, showWait:p_show_wait});
    	},	
    	
    	
    })();	
    

    on every submit button, we simply execute "javascript:gcc.submit('YOUR_REQUEST');"

  • bshumway OP 2.8 years ago

    Maybe the APEX team could add a “Show Wait” attribute to the Button component, when the behavior is “Submit Page”. A lot of developers suffer from this problem and many don't know enough JavaScript or aren't savvy enough with DA's to know the difference between submitting a page, and triggering a DA to submit the page. A “Show Wait” attribute would be very convenient.

  • bshumway OP 2.8 years ago

    The naming of “Show Wait” doesn't exactly convey that its blocking the entire UI though. I wonder if “Show Wait” could be renamed to something better… both for the DA and for the “Show Wait” attribute I'm proposing.

  • moss OP 2.7 years ago

    Need this too. I have so many applications/pages with a button that submits page and a pl/sql process that is being called when the button is pressed…lets say that the pl/sql does some inserts etc. I really hoped that APEX was handling this for me by default so I dont need to worry about users doing a double-click… but I begin to suspect that sometimes mysterious double transactions occur because of this. 

    Having said that: hanks to the APEX dev team for having created this great tool which I love.

  • pjones_dev OP 1.4 years ago

    Be handy if could do this for navigation menu entries too!

  • fac586 OP 1.4 years ago

    @pjones_dev Be handy if could do this for navigation menu entries too!

    Indeed. Meantime we have a simple workaround in the form of a Dynamic Action on the Global Page:

    • Event: Click
    • Selection Type: jQuery Selector
    • jQuery Selector: .a-TreeView-node--leaf a:link
    • Action: Execute JS Code
    • Code:
    // Show the Wait overlay to prevent the user from double-clicking on menu
    // options.
    apex.widget.waitPopup();
    

    (Assumes Side Navigation Menu with all entries linking to standard pages)