how to compare id by jquery

Question

How to set on click button value?

In my html form a set of users each having separate id. The users are auto generated, if new user register means they come into list. Along with that i kept one button as "Invite". But this button id setting for whole users. If I kept on click button alert, it sets for whole users as alert msg.

EX: If John as one user and have id as 5,if i click John's invite button means, for all users the alert is coming. What I need is if John's invite I click means John only has to invited not all users.

How could I compare these user id and button id?

Here is a Code:

  <script>
  $(document).ready(function(){ 
  $(".InviteTeacher").click(function(){
alert('Invited');   
   });
   });
   </script> 

 <div class="thumb_section bx-def-margin-sec-right">
        __thumbnail__
    </div>
  <div class="button_wrapper">
  <input type="button" value="Invite" name="InviteTeacher" class="InviteTeacher"       id= "InviteTeacher"/>                 
        </div>

Here thumbnail is a user information.

you need to post your related HTML /JQuery Code.. else i think this question is most likely to get closed — bipen, Jul 15 '13 at 09:19
Post your code along with your question. Make a jsfiddle out of it if you can. — Billy Moon, Jul 15 '13 at 09:19

score 2 · Answer 1 · answered Jul 15 '13 at 09:20

2

Store the values in hidden inputs.

<form>
    <input type="hidden" name="from_id" value="1">
    <input type="hidden" name="to_id"   value="5">
    <input type="submit" value="Invite">
</form>

answered Jul 15 '13 at 09:20

Quentin

914,110
126
1,211
1,335

score 0 · Answer 2 · answered Jul 15 '13 at 09:18

0

At the place of generation buttons

$("#button" + userId).click(function(){

   //do this
})

answered Jul 15 '13 at 09:18

Suresh Atta

120,458
37
198
307

score 0 · Answer 3 · edited May 23 '17 at 12:21

Suppose #invite0, #invite1, #invite2, ... are the html id attributes of the buttons to invite users[0],users[1],users[2],... and doInvite(j) is a function will invite the user at users[j].

You need to bind the current i value to the doInvite function, to get the actual handler. See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

Note that doInvite(i) is wrong, that would invite them now, in the for loop, without pushing a button. And function(){ doInvite(i) } is wrong because i will have changed by the time the event handler is called.

But bind will create a new function for us with the loop value of i filled into the first parameter of the function. That can then be called as the event handler.

   for(var i=0; i<users.length; ++i){ 
      $('#invite'+i).click(doInvite.bind(null, i)); 
    }

or this can also be written with a closure

for(var i=0; i<users.length; ++i){ 
  $('#invite'+i).click(  (function(j){
     return function(){ 
        doInvite(j);
      }
    })(i) );
}

in which case the loop value of i is stored in a new scope created by the top anonymous function, inside its j parameter. You can think of this nesting of anonoymos functions as returning slightly different event handler functions each time around the loop. The j's all exist in their own scopes, and store the values 0,1,2,3,... as the loop progresses.

For another example about closures and event handler setting in a loop, see Event handlers inside a Javascript loop - need a closure?

For more on what closures are and what they do see How do JavaScript closures work?

how to compare id by jquery

3 Answers3