Tengo una tabla que se construye dinámicamente con la plantilla EJS. Quiero pasar un valor dinámico a una función jQuery cuando el usuario hace clic en el botón.
Así es como estoy construyendo mi tabla:
<% for(var i=0; i< automated_campaigns.length; i++) { %> ... <%= automated_campaigns[i].name %> <td> <button type="button" class="btn btn-danger btn" id="load" data-loading-text="<i class='fa fa-circle-o-notch fa-spin'></i>">Activate</button> </td> ... <% } %>Y esta es mi función jQuery que maneja el evento de clic:
<script type="text/javascript"> $('.btn').on('click', function(automated_campagin_name) { var $this = $(this); $this.button('loading'); $.get( "/automated-campaigns/change_status/" + str(automated_campaign_name), function( data ) { $( ".result" ).html( data ); alert( "Load was performed." ); }); setTimeout(function() { $this.button('reset'); }, 8000); }); </script>¿Cómo puedo enviar el nombre_campaña correcto?
Coloque el campaign_name en un data-campaign_name ya que ya está recorriendo cada uno de ellos y luego acceda a él en jQuery.
$('.someElement').data('campaign_name');Puede establecer atributos de datos en cada botón que necesite:
<button type="button" data-cname="<%= automated_campaigns[i].name %>" class="btn btn-danger btn" id="load" data-loading-text="<i class='fa fa-circle-o-notch fa-spin'></i>">Activate</button>El script puede tener este aspecto:
<script type="text/javascript"> $('.btn').on('click', function(automated_campagin_name) { var $this = $(this); var cname = $this.data("cname"); $this.button('loading'); $.get( "/automated-campaigns/change_status/" + str(cname), function( data ) { $( ".result" ).html( data ); alert( "Load was performed." ); }); setTimeout(function() { $this.button('reset'); }, 8000); }); </script>