jquery ajax button onclick event not working

Question

I have 2 buttons, one to reduce quantity and one to add quantity. The html codes for the button are like this.

<button id='plusqty' type='button' value='".$row['idshoppingcart']."' class='btn btn-default btn-number' >+</button>
<button id='minusqty' type='button' value='".$row['idshoppingcart']."' class='btn btn-default btn-number' >-</button>

and the ajax code for the minus button

$("#minusqty").click(function(){
        var action = 'data';
        var type = '-';
        $.ajax({            
            url:'changeqty.php',
            method: 'POST',
            data:{action:action,type:type,id:$(this).val()},
            success:function(response){
                $("#result").html(response);

            }
        });
    });

I use the same ajax method with other buttons in my website, such as the add to cart function, and it works fine. But this one in particular doesn't work. I click the "+" button and nothing even happens at all which leads me to believe the jquery listener is not firing. Any advice? Thanks a lot!

EDIT: i changed to a the ajax listener to a class selector as someone has mentioned, still doesn't work though.

Arsi · Accepted Answer · 2019-11-23 16:38:30Z

3

You are using a class selector:

$(".minusqty").click(function(){

Use an id selector instead:

$("#minusqty").click(function(){

answered Nov 23, 2019 at 16:38

Arsi

17611 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Ian Lee Over a year ago

oh thanks! but sadly it still doesn't work. actually I had minusqty in the class too but i removed it for this question because it might look redundant.

Arsi Over a year ago

I see. In that case, you could put a console.log() inside the function to check if the event triggers (or use browser tool). If it works, then it might be a problem with your ajax call.

Ian Lee Over a year ago

yeah its not triggering! its hard for you to say without seeing my code but is there any possible reason why? i have my id set correctly and everything. and the onclick() call for the quantity is in the same file as other working ajax functions. thanks a bunch

Arsi Over a year ago

Some possible reasons could be: - The ajax file was loaded before the element, therefore it is not binded. So make sure the element is rendered first or try doing it this way instead: $("#minusqty").on('click', function(){ Other possibilities: - The file with the ajax functions was not imported in that page - Duplicate id

Ian Lee Over a year ago

oh i found the problem you were right the ajax file for that particular page didn't load because i didnt include the file which had the jquery import script. stupid mistake but thanks for helping!

|

John Clinton · Accepted Answer · 2019-11-24 00:56:42Z

2

$(document).on('click', '#minusqty', function()

});

edited Nov 24, 2019 at 0:56

answered Nov 23, 2019 at 17:32

John Clinton

2141 silver badge6 bronze badges

Collectives™ on Stack Overflow

jquery ajax button onclick event not working

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related