There are several occasions that users try to click a button multiple times in a row for whatever reason.
I want to disable or hide a button for a few seconds after it is clicked, so that it will not be clicked again temporarily.
By buttons here I mean every button in Odoo that is possible to implement this feature.
Is there a solution to achieve such mechanism?
If there is no system-wide implementation for this, a button-specific method will suffice.
$(document).ready(function () {
$("#yourbutton").on('click', function (event) {
event.preventDefault();
//your js code
//to disable the button:
$(this).prop('disabled', true);
});
});
Related
I see currently in Global Payment document, if we want to launch the light box, we need to pass the id of the button, then global payment will handle itself the 'onClick' function to open the lightBox :
$(document).ready(function() {
$.getJSON("sdkRequestEndpoint", function(jsonFromRequestEndpoint) {
RealexHpp.setHppUrl("https://pay.sandbox.realexpayments.com/pay");
RealexHpp.lightbox.init("payButtonId", "responseEndpoint", jsonFromRequestEndpoint);
});
});
I wonder can I handle the onClick function by myself, because I am trying to call another api to check a condition, if that api return true, it will automatically open the lightBox .
Thanks
I want to do some action on close button for ModalDialog box. I am using "idx.widget.modaldialog" in dojo. Is there any way to capture the close event?
The idx.widget.modaldialog extends the dijit.dialog so you can implement the onClose method.
For example:
onClose: lang.hitch(this, function(){
// some code
}),
When using this hook and adding a product to the cart it fires multiple times - for each 'add to cart' button on the page. So the item quantity gets multiplied.
addProductToCart() {
utils.hooks.on('cart-item-add', (event) => {
event.preventDefault();
});
}
How do I change that to only fire once for the button clicked?
I used the hook outside of 'addProductToCart' and it works fine. I'm good now. - Cheers
*I am using this code in my controller, inserting this controller dependency is breaking the whole code. *
$state.get('shop').onExit = function(){
modalCtrl.openModal(modalViewUrl,null);
//calling a controller which has the functions to open $modal
//handle modal submitHandler
}
1.this event will be invoked when user navigates away from the page:
$scope.$on('$locationChangeStart',function(event){
//action to be performed
event.preventDefault();
$('#modalName').modal();
});
I have a regular anchor tag with href attribute set to "#". Normally, this prevents from any navigation but in durandal it navigates me to the home view. How can I stop it from navigating to that view?
I can't change the html and stylings. It needs to be that anchor tag. But I can bind a click event to it. Is there any way to cancel navigation in anchor click event?
regards
Bind a click event to it and call event.preventDefault()
Example
$(function() {
$('#someAnchor').click(function(event) { event.preventDefault(); });
});
This will prevent the browser from propagating the click event and nothing will happen. But inside the click event you can do whatever logic you want.
If you are using knockout to bind the click event then please refer to this stackoverflow post on how to do it from a knockout binding.
EDIT ** Per Tyrsius' comments its a better practice to use the knockout binding to bind a click event.
So, instead it is recommended you do:
ClickMe
clickhandler = function (e) {
e.cancelBubble = true;
if (e.stopPropagation) e.stopPropagation();
};
Have all your anchor links start with a prefix. Then have in your router.guardRoute function this:
if (_.startsWith(instruction.fragment, YOUR_PREFIX))
return false;
}
Worked well for me and no need to add anything else to your app views.
PS. _.startsWith is lodash function. If not using lodash do JS string indexOf or whatever