handling clicks on an element in php for loop in jquery

Question

I have been trying to use jquery click event with an element in php for loop. How can I transfer the counter value to jquery before click.

My PHP Code:

<?php $counter=0;foreach($a as $abc){$counter++;?>
        <div id="mail_<?php echo $counter;?>" class="ma" />
   <?php }?>

Jquery Code:

$(document).ready(function(){
  $(".ma").click

How could I use this counter variable before click in jquery.

parseInt(element.getAttribute('id')) ? Why do you even need this anyway ? — Virus721
– Virus721, Commented Apr 26, 2013 at 7:10

RafH · Accepted Answer · 2013-04-26 07:12:06Z

1

Why "before" click ? In the following example, you get the counter value of the clicked element.

$(".ma").on('click', function(e) {
  var counter = $(this).attr('id').split('_')[1];
});

Note that you can do the same thing without using id as your counter starts at 0 and just increment one by one.

  $(".ma").on('click', function(e) {
     var counter = $(this).index();
    });

If you need the final value of counter, you can use $(".ma").length

answered Apr 26, 2013 at 7:12

RafH

4,5442 gold badges25 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Aayush Aarwal Over a year ago

how could jquery will identify which element was clicked??

RafH Over a year ago

$(".ma") means all element with class "ma". Inside the click event handler of this selector, $(this) refers to the currently clicked ".ma" element. api.jquery.com/click

Jenson M John · Accepted Answer · 2013-04-26 08:18:27Z

Example : Full HTML Code. Just copy, Paste & Run in Browser. [Used @RafH's Solution]

<html>
    <head>
       <title>jQuery Test</title>
    <style type="text/css">
    div { color:blue; margin:3px; cursor:pointer; }
    </style>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
     <script type="text/javascript">

    $(document).ready(function() {
     $(".ma").click(function() {
      var counter = $(this).attr('id').split('_')[1];
      alert("Counter ID "+counter);
    });
    }); 

    </script>
    </head>
    <body>
        <?php 
        for($counter=1;$counter<=10;$counter++)
        {
        ?>
        <div id="mail_<?php echo $counter;?>" class="ma" />Test</div>
       <?php 
       }
       ?>

    </body>
</html>

Collectives™ on Stack Overflow

handling clicks on an element in php for loop in jquery

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related