Item delete buttons in a table?

Question

Hi, this is a simple html question but I would like to know the correct way of doing it.

I have a table in my page, with tabular data, and it's a display of items in the database. I build the table dynamically with php, and just output html.

I want to add a column "delete this entry" with a button/link/picture on every line, and when it's clicked, my page refreshes and php knows which itemID should be deleted.

The question is not about php, but about the html part.

How can I make the delete-button compliant with standards? Here's an incorrect solution:

<table>
<form action='#' method='post'>
<tr>
<td>Item 1</td>
<td><input type='hidden' name='id' value='1'><input type='submit' value='X'></td>
</tr>
</form>
<form action='#' method='post'>
<tr>
<td>Item 2</td>
<td><input type='hidden' name='id' value='2'><input type='submit' value='X'></td>
</tr>
</form>
</table>

Anyone an idea on a good solution? I'd prefer not to use much javascript, if it can be avoided. Thanks in advance!

Edit: actually, I have a secret second question too: what if i were to want to do inline editing (after pressing an Edit button), as in: make the cells with the values contain boxes, and a submit button at the last cell?

Answer 1

You could go with a simple GET procedure, like this:

<a href="showResults.php?action=delete&item=112">Delete</a>

Note the action and item values in the URL. These would be evaluated before the database is called and the results are printed in showResults.php. Your PHP (on showResults.php) would start with a block of logic that checks to see if any actions were requested, such as delete. If an action is present, it checks to see if an item is as well. I will then do whatever authentication necessary to ensure the user has sufficient rights to do this action to this item.

Next it would query the database (now lacking said item assuming the deletion was successful) and redraw the page. The links would be built within your loop used to create the many table-rows:

<?php foreach ($products as $product) { ?>
<tr>
  <td>
    <a href="sr.php?action=delete&item=<?php print $product->id; ?>">Delete</a>
  </td>
  <td>
    <p><?php print $product->title; ?></p>
  </td>
</tr>
<?php } ?>

Answer 2

Add a submit button to each form and send the operation you want to execute as value attribute of each button

<table>
    <form action='#' method='post'>
        <tr>
            <td>Item 1</td>
            <td><input type='hidden' name='id' value='1'><input type='submit' value='X'></td>
            <td><button type="submit" value="remove" name="op">Remove</button></td>
            <td><button type="submit" value="edit" name="op">Edit</button></td>
        </tr>
    </form>
</table>

Answer 3

Why not isolate the forms and pass the ID to the action page?

<table>
    <tr>
        <td>Item 1</td>
        <td><form action='action.php?id=1' method='post'><input type='submit' value='X'></form></td>
    </tr>
    <tr>
        <td>Item 2</td>
        <td><form action='action.php?id=2' method='post'><input type='submit' value='X'></form></td>
    </tr>
</table>

Answer 4

It's kind of messy, but going off of what Agent said, you could do something like this to get a text input in there too:

<form action='action.php?id=1' method='POST'>
<table>
    <tr>
       <td>Item 1</td>
       <td><input type="text" value="" /></td>
       <td><input type='submit' value='X'></td>
    </tr>
</table>
</form>

<form action='action.php?id=2' method='POST'>
<table>
    <tr>
       <td>Item 2</td>
       <td><input type="text" value="" /></td>
       <td><input type='submit' value='X'></td>
    </tr>
</table>
</form>