AJAX click not working

Question

$(document).ready(function(){

  $('#urun_ekbilgi').click(function() { 
    var clsnm = $(this).attr('class');
   $.ajax({
      type: 'POST',
      url: 'urun_bilgisi.asp',
      data: 'sno='+clsnm,
      success: function(ajaxCevap) {
        $("#ajaxPage").html(ajaxCevap);
      }
    });
    return false;
  });
});

<a id="urun_ekbilgi" class="1">İçerik 1 Getir</a><br>
<a id="urun_ekbilgi" class="2">İçerik 2 Getir</a><br>
<a id="urun_ekbilgi" class="3">İçerik 3 Getir</a><br>

<div id="ajaxPage"></div>

urun_ekbilgisi doesn't work !

click class="1" work
click class="2" doesnt work ? why !

`id` should be unique on the page. You shouldn't have the same `id` - Javascript can't distinguish between them. — , Jun 28 '14 at 06:03
# urun_ekbilg dynamically from a database is made. How do I fix ajax side and by a ID — weboss, Jun 28 '14 at 06:08

score 0 · Answer 1 · answered Jun 28 '14 at 09:35

When using ID element jquery assume there is only one element to find (as ID should be unique). That is why only the first "a" tag works. Instead you want to use a common class for all "a" tags, as there can be multiple tags with same class.

Something like this should do the trick:

$(document).ready(function(){

    $('.urun_ekbilgi').click(function() { 
    var clsnm = $(this).attr('class');
    $.ajax({
          type: 'POST',
          url: 'urun_bilgisi.asp',
          data: 'sno='+clsnm,
          success: function(ajaxCevap) {
              $("#ajaxPage").html(ajaxCevap);
          }
    });
    return false;
    });
});

<a class="urun_ekbilgi">İçerik 1 Getir</a><br>
<a class="urun_ekbilgi">İçerik 2 Getir</a><br>
<a class="urun_ekbilgi">İçerik 3 Getir</a><br>

<div id="ajaxPage"></div>

AJAX click not working

urun_ekbilgisi doesn't work !

1 Answers1