[Resolved] WooCommerce Quantity Buttons Problem

Home Forums Support WooCommerce Quantity Buttons Problem

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1447804
    Alberto

    Hello, I have a problem with the woocommerce quantity buttons.

    Sometimes they work, other times not. In Chrome they usually work, but not in Safari nor Mobile.

    This is the url: https://aloeole.com/product/aloeole-pure-aloe-vera-body-gel/

    I don’t know why this is happening…

    Thank you!

    #1447807
    Leo
    Staff
    Customer Support

    Hi there,

    I just tested the page using my phone with Chrome and Safari but did not notice the issue.

    Do you see the same issue in the sample page here?
    https://gpsites.co/seller/product/quality-poster/

    #1447883
    Pedro

    Hello Alberto!

    Are you building that site with GeneratePress? It is incredible!

    I would like to ask you, how did you place the tabs of the drop-down product?

    #1448117
    Alberto

    Hi Leo,

    It’s not happening in the “Seller” template. I used the “Merch” one as a base for my design, but in the template it’s working properly, but not in the site. The issue is happening to me mostly in Safari with my Mac.

    I’ve inspected the html code and it’s curious, because in Chrome it shows this:


    <label class=”screen-reader-text” for=”quantity_5f645361c2a20″>Aloe Vera Gel with Hyaluron quantity</label>
    <input type=”number” id=”quantity_5f645361c2a20″ class=”input-text qty text” step=”1″ min=”1″ max=”” name=”quantity” value=”1″ title=”Qty” size=”4″ placeholder=”” inputmode=”numeric”>
    +

    But in Safari the links are missing and the class “buttons-added” it’s not showing neither:

    <label class=”screen-reader-text” for=”quantity_5f6453ec9f0f1″>Aloe Vera Gel with Hyaluron quantity</label>
    <input type=”number” id=”quantity_5f6453ec9f0f1″ class=”input-text qty text” step=”1″ min=”1″ max=”” name=”quantity” value=”1″ title=”Qty” size=”4″ placeholder=”” inputmode=”numeric”>

    Any clue?

    Thank you!

    #1448331
    Alberto

    I have checked that it’s a problem of the jQuery declaration. I have a jquery-3.3.1 version declared in a footer hook and somehow it’s making the quantity buttons are not working in safari.

    I tried deleting the jquery-3.3.1 declaration and declarating jquery in the function.php file with this:

    add_action( ‘wp_enqueue_scripts’, ‘tu_load_jquery’);
    function tu_load_jquery() {
    wp_enqueue_script( ‘jquery’ );
    }

    But then my jquery code doesn’t work… I don’t know why.

    Thank you!

    #1448372
    Alberto

    Hi Pedro!

    Yes, it’s made with gp!

    I just hide the default tabs with CSS and put the drop down items in the content of the product. Very easy! 😉

    #1448898
    Leo
    Staff
    Customer Support

    That code shouldn’t be added using a footer hook.

    It should be added using one of these methods:
    Adding PHP: https://docs.generatepress.com/article/adding-php/

    #1448954
    Alberto

    No Leo, I didn´t add that code in a hook.

    I added the the php code in the function.php file of my child theme.

    I want to know if there is a problem using the jquery-3.3.1 version with the quantity buttons and because of that, they are not working properly with safari.

    #1448997
    Leo
    Staff
    Customer Support

    Unfortunately this is something you will need to check with WooCommerce’ support as the quantity button is coming directly from the plugin.

    Sorry about that!

    #1449008
    Alberto

    Yes, but you have an option in “Customize – Layout – Woocommerce – Single Product – Display quantity buttons” and that option has to has a code associated in some of your files, right?

    Where is that code in order to try to replicate or fix the problem?

    Thank you!

    #1449072
    Tom
    Lead Developer
    Lead Developer

    Actually the theme is responsible for adding the buttons to the quantity field.

    Strange that it’s conflicting with specific jQuery versions though – it’s pretty simple jQuery. Can you try the latest 1.12.0-beta version? We did some rewriting of that code that may help.

    #1449677
    Alberto

    Solved it!

    Eventually, I didn’t have to update to the beta version, I downgraded the jquery version from 3.3.1 to 1.7.1 and everything works properly now.

    Despite of that I don’t know why my code wasn’t working with your jquery version. jQuery versions it’s something I don’t quite understand…

    Thank you for your time and sorry for the inconvenience!! 🙂

    #1450145
    Tom
    Lead Developer
    Lead Developer

    No problem, glad you got it working 🙂

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.