Hi all,

We have an issue whereby multiple clicks of a button get sent to the backend before we can respond and disable the button in a callback. Imagine a button that you only want to be allow to get pressed once before the server has responded with some updated data. Perhaps a form with some values and an "Execute Trade" button. You would like to make sure the trade is sent once, portfolios and prices are calculated in dash and then updated on the client, before allowing them to press again. You might instead disable the button until the trade has totally completed.

We have explored different options on the backend, from opening a transaction block, to requiring a token that represents the latest update, but all of these methods are a bit fiddly, and offer a poor UX. What we would like to happen would be a button that upon clicking, disables itself, and then it's the server's job to renable that when it sees fit.

I can't see a way of doing this faster than someone can double-click other than doing it in the Javascript. I envisage something like dbc.Button(id="my-button", disable_on_click=True). You could do something more advanced like disabling automatically until completion of the callback, but perhaps it's clearer to just make the callback return Output("my-button", "disabled").

This is more of a question for dash than dbc I guess, but I think that LoadingState has to be engaged by the backend, so wouldn't work here?

Unless there is a workaround, does this seem useful? If so, could anyone offer me guidance on how to implement this? I'm a confident Python dev but an intimidated Javascript one. If there is some prior art I'm happy to take that and try and learn from it.

Thanks!