Disable add to cart button before modal confirmation is shown in prestashop 1.7 - modal-dialog

On my prestashop 1.7.6.8 I am noticing a very slow timing to add the product to the cart and then to show the modal popup of confirmation.
Is it possible to avoid users click on button during this latency?
Thank you

Hi I done it like that:
$(document).ajaxStart(function(){
$( '.add-to-cart' ).addClass("sending");
});
$(document).ajaxStop(function(){
$( '.add-to-cart' ).removeClass("sending");
});

Related

Hide paypal payment button

I want to hide the paypal payment button. I am using the paypal Javascript SDK. I know I can use the disable-fundings to disable credit card and so on. But there is no option for paypal. I am using my own payment method selection before. I have tried with jQuery but it does not work:
<script>
$( document ).ready(function() {
$( ".paypal-button-row.paypal-button-number-0" ).hide();
});
</script>
The paypal payment buttons are rendered by the Javascript SDK in a div called "paypal-button-container". That creates an iframe where all the payment buttons are in.
<div id="buttons-container" class="buttons-container"...
Inside that are other divs with the buttons. The button that I want to hide is this div:
<div class="paypal-button-row paypal-button-number-0 paypal-button-layout-vertical paypal-button-shape-rect paypal-button-number-multiple paypal-button-env-sandbox paypal-button-color-gold paypal-button-text-color-black paypal-logo-color-blue ... ">
I think at first I have to go into the iframe and then find the element.
Currently I am trying this
if ($( "#paypal-button-container" ).contents().find(".paypal-button-row.paypal-button-number-0")) {
console.log("found");
$( ".paypal-button-row.paypal-button-number-0" ).hide();
}
The console outputs "found". But it does not hide the div. Meanwhile I found out that the console always shows "found" even with a .find("abc").
Any ideas?
It appears what you are actually looking for is rendering standalone buttons.
Note that presenting such independent/standalone buttons for e.g. radio button functionality or to use your own layout for the buttons is not to be used to avoid/hide presenting the PayPal option somewhere on the site with equal prominence to other payment methods. If you don't feature the PayPal payment method alongside other options the PayPal account's processing could be deactivated, since that's a violation of its TOS.
if ($( "#paypal-button-container" ).contents().find(".paypal-button-row.paypal-button-number-0"))
This approach shouldn't be used, but FYI the problem with that use of jQuery is you need to make use of .length after invoking it, and test against that. Note the difference:
if ( $('#myElement').length ) {
console.log('#myElement was actually found')
}
if ( $('#myElement') ) {
console.log('This will always be true regardless...')
}
It's probably also executing too soon, not after the buttons are fully rendered. But anyway there's no reason to do it this way, see the standalone buttons documentation above.
That sounds great. With the standalone buttons it looks like it is working.
I have added the script for it.
var FUNDING_SOURCES = [
paypal.FUNDING.<?php echo $paymentMethod; ?>
];
// Loop over each funding source/payment method
FUNDING_SOURCES.forEach(function(fundingSource) {
// Initialize the buttons
var button = paypal.Buttons({
fundingSource: fundingSource
});
// Check if the button is eligible
if (button.isEligible()) {
// Render the standalone button for that funding source
button.render('#paypal-button-container');
}
});
I will continue to test it.
Of course we offer also Paypal as payment method.
For hide other buttons use this:
<script
src="https://www.paypal.com/sdk/js?client-id=sb&currency=EUR&disable-funding=card,sofort">
</script>

Update checkout sidebar after minicart update

I have an usecase where my customer has the top magento shopping cart icon available in the checkout.
The problem however is the fact that when someone updates the quantity on the minicart, the sidebar is not refreshed and thus wrong content is displayed there.
I already tried to extends this feature and found the minicart and a way to extend it but i cant find the right way to extend the "update QTY" event.
After that update i need to refresh the page. The sidebar should show other information but also the step of the checkout itself is dependent based on the content of the cart itself. So for a QTY of 2 there are extra fields on a specific step etc.
Hope someone can help
Best,
Pim
In vendor/magento/module-checkout/view/frontend/web/js/sidebar.js the _updateItemQtyAfter method will fire the following trigger: $(document).trigger('ajax:updateCartItemQty').
$(document).on('ajax:updateItemQty', $.proxy(function () {
// your stuff here...
}, this));
Or you can override and extend the method _updateItemQtyAfter in vendor/magento/module-checkout/view/frontend/web/js/sidebar.js.
The update button in the sidebar will fire the XHR /checkout/sidebar/updateItemQty/, so if above won't work you can try to do the following:
$(document).ajaxComplete(function(event, xhr, settings) {
if (settings.url.indexOf('checkout/sidebar/updateItemQty') !== -1) {
// your stuff here...
}
});

back-button doesn't work properly ionic famework

I have this flow in my ionic app... login.html page(which is a "ion-view")->side-menu page(side-menu from ionic framework)->page2.html page(which is a "ion-view"). Now i want to implement "ion-nav-bar" with "ion-nav-back-button" in it. Normally when i want to go back from page2.html the app should sent me to side-menu page....instead, my app, sent me to login page. Seems like side-menu does not have "ion-view" in it and it is not recorded in app flow. Any suggestion how can i solve that ? thank you
There is no a state for side menu, you can not 'go back' to open side menu.
In the normal, for the login view, you should disable the state temporally. Then the app will not 'go back' to login view. You can do it like this:
$scope.doLogin = function () {
Auth.login($scope.loginData, function () {
console.log('login success');
$ionicHistory.nextViewOptions({
disableBack: true
});
$state.go('home');
});
};
And you can also clear the view history of ionic to avoid going back with:
$ionicHistory.clearHistory();
$state.go('user.home');

Onclick open new window and reload previous page

I trying to have a new window pop up to checkout at Paypal, OK. Problem is that if user goes back to add or take away items and click "checkout" again, the pop up does not work. The only solution I can think of is when customer submits form to check out, the action opens up a new window and reloads the page they were just on. Can this be done or is there another way?
checkoutPayment: ' {payment}',
paypal: '<form target="_blank" id="rcCartForm" action="https://www.paypal.com/cgi-bin/webscr;" method="post">' +

nyroModal v2: How to validate form opened in iframe?

I'm trying to figure out how to validate a form opened using nyroModal.
The page is being opened as below on click of a button:
$(function() {
$('.btnedit').click(function() {
$.nmManual('form_page.php);
});
});
On the form that opens up, I have a few fields that are mandatory and a cancel & submit button.
<a class="nyroModalClose button" href="#" id="btn_submit">Submit</a>
On clicking of the submit button, I want to make sure the mandatory fields have value. If no, an error message should be displayed & the modal window should not close.
I'm trying to use the jquery validation plugin, but without success. The modal window always closes irrespective of the validation scripts.
I haven't found much info regarding form validation in a modal window. Is this not a preferred approach?
Thanks in advance.
I'm not able to help you about the jquery validation plugin in a modal window, but I know that using the instruction $.nmManual in that way, the form will not be placed inside the iframe tag, and if I remember correctly the content of new page will be added without header and body tags, so in a word incorrectly. I guess this can produce no validation.
To successfully open an iframe you need to use filters as described here:
Open iframe manually in nyroModal?
I hope this can help you.