CODEWITHSUNDEEP
javascriptjqueryhtmltriggers
hawkhorrow
hawkhorrow

Reputation: 475

Jquery Use Row of Table Populated By PHP in Loop

was hoping to have someone with jQuery expertise help me out here...

I have a table that is created dynamically through php using such code:

...
  <tbody>
<?php
foreach ($members as $member){
  echo '<tr>';
    echo "<td><a href='#' class='edituser-information' title='edituser_information' data-id=" .$member['id']. "><img src='/images/edit-button.png' width='59' height='28' alt='EDIT'></a>";
  echo '</tr>';
}?>
  </tbody>
...

I am passing information into a jQuery function and then ajax using this:

$('#editUsersTable tbody').on('click', 'tr', function (){           
  data_id = $('td a.edituser-information', this).eq(0).attr('data-id');
  $.ajax({
   url: 'edit_specific_user.php',
   type: 'POST',
   data: {id : data_id},
   ...

THE PROBLEM:

The ajax script picks up data-id correctly because it loads the information right through the row that was clicked on... Unfortunately, what I want is the user is FORCED to click the edit button, and not just the row in the table...

As of now, the user can just click the row, and then it proceeds right into the jQuery because the entire row is the trigger.

How can I change it that the user must click the specific row's edit button, and not the row itself?

Thank you in advance!!

Upvotes: 0

Views: 80

Answers (2)

Scopey
Scopey

Reputation: 6319

You need to change the propogation selector in the very first line:

$('#editUsersTable tbody').on('click', 'tr', function (){

changes to

$('#editUsersTable tbody').on('click', 'tr a', function (){

Refer to the "Direct and Delegated events" section in the jQuery documentation for "on"

http://api.jquery.com/on/

Upvotes: 0

roullie
roullie

Reputation: 2820

try 

$('#editUsersTable tbody tr td').on('click', 'a.edituser-information', function (){           
    data_id = $(this).eq(0).attr('data-id');
    $.ajax({
    url: 'edit_specific_user.php',
    type: 'POST',
    data: {id : data_id},
    ...

Upvotes: 1

Related Questions