why my Ajax request is performed 3 times ?

rubyonrails-talk
1

I wrote in my view :

#showcases   - @category.showcases.each do |showcase|     %a{'data-remote' => 'true', :href => "#{showcase_url(showcase)}"}       .showcaseSelector{:style => "border-color: #{showcase == @selected_showcase ? 'black' : 'transparent'}; background-color: ##{showcase[:color]};"}

which generate the following html : ( seems correct , 2 links with colored boxes

<div id="showcases">   <a href="http://localhost:3000/showcases/20&quot; data-remote="true">     <div style="border-color: transparent; background-color: #2a6996;" class="showcaseSelector"></div>   </a>

  <a href="http://localhost:3000/showcases/21&quot; data-remote="true">     <div style="border-color: black; background-color: #b39117;" class="showcaseSelector"></div>   </a> </div>

when I click on a link , I can see 3 requests in my console ( and 3 times the show action executed ... ) GET http://localhost:3000/showcases/21 200, OK GET http://localhost:3000/showcases/21 200, OK GET http://localhost:3000/showcases/21 200, OK

I don't where stating to check for an error... any clue ?

thanks for your feedback

2

I changed the helm/html code as it might not be standard to put a din inside an <a> tag , but same issue Ajax GET request sent 3 times

  - @category.showcases.each do |showcase|     .showcaseSelector{:style => "border-color: #{showcase == @selected_showcase ? 'black' : 'transparent'}; background-color: ##{showcase[:color]};"}       = link_to '', showcase_url(showcase), :remote => true

3

i suppose that with data-remote you are letting the buildin ujs handle everything but this js is build to be used with link_to so what i think is that the event is been triggered 3 times because that js is effectively attaching the event 3 times, so either use link_to or handle the click event your self, is not hard at all

$(“#shocases a”).clikc(function(){

console.log(“cogito ergo google”);

});

you can send aja with this

$.ajax({

type: ‘get’,

url : $(this).attr(‘href’),

success: function(){

alert(“Annoying message”);

}

});

$(this) will be the clicked link