Vikas Kumar
Vikas Kumar

Reputation: 1

How to Call Ajax With Same Div Multiple Times

I am calling ajax with below code in my index.php file.

<script type="text/javascript">
    $(document).ready(function(){
        $("#counting").click(function(){
            $.ajax({
                type: 'POST',
                url: 'https://example.com/update.php',
                data: {url: '<?=$url?>'},
                success: function(data) {
                   // alert(data);
                    //$("p").text(data);

                }
            });
   });
});
</script>

It's working perfectly, but the issue is I have div called counting multiple times on the page. example

 <div id="counting">
<a href="example.com">example</a>
</div>

 <div id="counting">
<a href="example.com">example</a>
</div>

Issue - Ajax call only works with first div, not below divs. How to make it work with all divs with id counting

Upvotes: 0

Views: 525

Answers (1)

Difster
Difster

Reputation: 3270

Id attributes are supposed to be unique. You're only ever going to get the first div called because once the DOM sees that, it's met it's requirement and doesn't search further. I suggest you give you divs unique ids and then use a class that is the same for all of them.

 <div id="div1" class="counting_class">
<a href="example.com">example</a>
</div>

<div id="div2" class="counting_class">
<a href="example.com">example</a>
</div>

Then your jQuery would look something like this:

$(".counting_class").click(function(){
  var id = $(this).attr('id');
//then call ajax based on the individual ID
}

Upvotes: 2

Related Questions