Question

Currently I am pulling data out of a database to build a table dynamically. After pulling the data, I want myself and or my users to be presented with an option (button) where if they click the button I can edit/remove this row from the table as well as from the database.

I am new to jQuery so I am not sure what I should use for the $.ajax() functionality.
This is my php code:

foreach($stmt as $item){

            echo '
            </td>
            <td>'.$item['asin'].'</td>
            <td>'.$item['weight'].'</td>
            <td>'.$item['dimension'].'</td>
            <td>'.$item['category'].'</td>
            <td>';

                    echo '<button type="button" class="btn">Update Me!</button>';

            echo '
            </td>
        </tr>';
    }
    echo '</tbody>
    </table>';

This is my jQuery code:

      $(document).on('click', '.btn', function() {
    $.ajax({
    //code here etc
    success:function(){
    //what to put here?
    }

});
}

Answer 1

All of this is paraphrased – you should be able to get the answer from here. At least well enough to try something and post a fuller example.

1) Each table row needs to have an identifier that the javascript can grab. You may find this easier with a data_ element

PHP has:

echo '<button type="button" class="btn" data_id="'.$item['asin'].'">Update Me!</button>';

JS has:

$(document).on('click', '.btn', function() {
   var id = $(this).attr('data_id');
   ...

2) You need a PHP function that returns update data for that row

<?php

    if (isset($_GET['id'])) {
         $id = $_GET['id'];
         $item = Get Data From Where Ever
         echo '<td>'.$item['asin'].'</td>
               <td>'.$item['weight'].'</td>
               <td>'.$item['dimension'].'</td>
               <td>'.$item['category'].'</td>
               <td><button type="button" class="btn" data_id="'.$item['asin'].'">Update Me!</button></td>';
    }

 ?>

3) Use javascript / ajax to get the data

$(document).on('click', '.btn', function() {
    var id = $(this).attr('data_id');
    var self = $(this);
    $.ajax({
       url: 'MyUrl?id=' . id;
       success:function(data){
           $(self).html(data);
       }
    });
}

It’s not perfect, you’ll need to worry about making stuff safe, error checking etc, but that should give you the leg up you need.