Question

I have read a lot about this issue in many threads. The best I have found is
here: jQuery's .click – pass parameters to user function

 // say your selector and click handler looks something like this...
 $("some selector").click({param1: "Hello", param2: "World"}, cool_function);

 // in your function, just grab the event object and go crazy...
 function cool_function(event){
    alert(event.data.param1);
    alert(event.data.param2);
 }

My problem is that I want to assign dynamically values for my parameters. Not just “Hello” etc.

For example I have something like this:

   <?php
   for($i=0;$i<5;$i++){
   ?>
   <input type="text" id="client_<?=$i?>"> 
   <?
   }
  ?>

How can I rewrite jQuery to handle different values for parameters? For example 0,1,2,3,4

Obviously, I can’t do something like

 $("#client_1").click({num:1}, cool_function);
 $("#client_2").click({num:2}, cool_function);
 $("#client_3").click({num:3}, cool_function); 

etc.

Answer 1

In that specific example, you’re probably best off just grabbing the id, since you’re already outputting it to the element:

$("some selector").click(function() {
    var num = parseInt(this.id.replace(/\D/g, ""), 10);
    // Do something with `num`
});

If you weren’t already putting an id there, you could use a data-* attribute:

<?php
for($i=0;$i<5;$i++){
?>
<input type="text" data-num="<?=$i?>"> 
<?
}
?>

…and then retrieve it in the click handler:

$("some selector").click(function() {
    var num = parseInt($(this).attr("data-num"), 10);
    // Or
    var num = parseInt($(this).data("num"), 10);
});