Symfony & js : button not working in certain conditions-CodePudding

I have a simple "plus/minus" functionality for the product quantity on the product detail page on a shopware6 site (version 6.4.8.1) (See attached image)

See here my code in /views/storefront/page/product-detail/buy-widget-form.html.twig.

{% block page_product_detail_buy_quantity_container %}
<div >
    <div >
        <div >
            <span>{{ "detail.labelQuantity"|trans|sw_sanitize }}</span>
        </div>
         <div >
                    {% block page_product_detail_buy_quantity %}
                            <div >
                                    <span  id="moins" {#onclick="minus()"#}> {% sw_icon 'minus' %} </span>
                                    <input id="amountToBasket" type="text" name="lineItems[{{ page.product.id }}][quantity]" value="{{product.minPurchase}}" autocomplete="off" maxlength="2" >
                                    <input id="minPurchase" type="hidden" name="minPurchase" value="{{product.minPurchase}}" autocomplete="off" >
                                    <input id="maxRange" type="hidden" name="maxRange" value="{{product.calculatedMaxPurchase}}" autocomplete="off" >
                                    <input id="purchaseSteps" type="hidden" name="purchaseSteps" value="{{product.purchaseSteps}}" autocomplete="off" >
                                    <span  id="plus" {#onclick="plus()"#}> {% sw_icon 'plus' %}</span>
                            </div>
                    {% endblock %}
        </div>
    </div>
</div>
{% endblock %}

And here's my js file related to the plus/minus buttons.

var minPurchase = $("#minPurchase").val();
var maxRange = $("#maxRange").val();
var count = $("#amountToBasket").val();

$("#plus").click(function () {
    if (count < maxRange){
        count  ;

        $("#amountToBasket").val(count);
    }
});

$("#moins").click(function () {
    if (count > minPurchase){
        count--;

        $("#amountToBasket").val(count);
    }
});

PROBLEM : This works perfectly for ALL products where the minimum purchase quantity is equal to 1. BUT if we click on the plus or the minus for every product having the minimum purchase quantity greater than 1, it's doing nothing. It gives the impression that the buttons are deactivated in this case.

Do you have any clue on what is going on?

CodePudding user response：

as replied by @DarkBee, I simply needed to specify the value type of the "count" function.

var count = parseInt($("#amountToBasket").val());