Table with a button on each row, how to know which one is clicked on?

[eluser]Merolen[/eluser]
Hi

I have a question which I would be happy to get some views on. I have a list of records as a table with a button on each row that will send you to another page with the ID of the row the button belongs to (everything from the DB, but not relevant).

My question is then, what's the best way to know which button is clicked on?

I have a few suggestions myself:

1. One form for each row with the action-attribute set to go to page/<id>

Code:

&lt;form action="page/<id&gt;">&lt;/form&gt;

2. Use one form for the whole table and name the edit buttons button_<id> and value'Edit' and then check the $_POST array for value 'Edit'

Code:

$key = array_search ( 'Edit'  , $_POST);
list($dummy, $id) = explode('_', $key);
redirect('page/'.$id);

Somehow I don't like the idea of having one form for each row, on the other hand I don't think the array_search() is the prettiest way either... My preferences here are just based on feelings and I can not give any good explanation to why I would prefer one thing over the other But now as I have the best of the best here at the tip of my fingers I thought I should ask for your opinion

[eluser]charlie spider[/eluser]
if it's just a list of records, and the user is simply going to click on one of the rows to access more information about that row, i would just use plain old links

- create a function that receives a parameter
- pass your ID number as the parameter

simple

use forms if you need a user to fill in data (ie: name, phone number, etc )
or to make multiple selections

if they are just selecting one record from many, use a link

[eluser]sandwormusmc[/eluser]
I had this same problem a while back (http://ellislab.com/forums/viewthread/65814/) and ended up working around it this way (sort of):

Code:

var baseURL='<your CI install>/index.php/<your controller_name>';

function doAjax(target,caller) {
    // target refers to the CI target function and corresponding row id
    var temp       = target.split('_');
    var actionName = temp[0];
    var id         = temp[1];
    var url=baseURL+'/<function_name>/'+actionName+'/'+id;
    /* if you want to use AJAX */
    var doesntmatter = new Ajax(url, {
        method: 'post',
        update: $(caller)
    }).request();
    /* if not, finish the following and : */
    // this.location or something using the url variable set above
}

html will look like this:

<a href="#"><img src='<your button>' id="show_435" onClick="doAjax(this.id,'<dom id of a div to update>');"></a>

the <a href> for the img above is only used to make the icon change for UI consideriations.

So the row id you're working with is in the DOM ID of the button img tag and gets sent to the appropriate CI function with the ID in the URL.

Use CI's url segment functions to parse out the ID and function name (action) in your back-end code ...

Hope that makes sense ... it's kind of a hack but it works for me. My actual implementation is a lot more complex, but I had to do JSON posts and get values from multiple form fields later in the project, so the JS and PHP code got pretty hairy.

HTH

[eluser]sandwormusmc[/eluser]
Actually looks like the URI's are simpler to parse than the url segment functions; they are done automatically according to the user manual: http://ellislab.com/codeigniter/user-gui...passinguri. I've been using uri_segment(3),(4),etc ... silly me.

[eluser]xwero[/eluser]
I have to agree with charlie spider if the only function is to pass the id for the details page links are the cleanest solution. Even if you want to catch how many times the details of a certain id are viewed.

[eluser]Merolen[/eluser]
@sandwormusmc: Great, why haven't any tutorial showed me this ? always (the few weeks I've used CI) thought that ->segment() was the way to do it. But I guess none of them are more generic than the other, so which one you use wouldn't make any difference I would think (with routing out of the box). But I like the passing of ids to the function because it gives a cleaner code and makes it easier to read in my opinion.

@charlie spider: I'm embarrassed that I didn't think of that. I was so fixed on using a button and form. But a direct link is so much easier. Not used to work with the one-url-for-every-new-page. Usually one often have the table listing and the edit form in the same file with an if{} on which to show.

Since this is not a prestige project I think I'll stick to the link in stead of button, don't want to waste any time with JS with this one. But I like the way where the rows are clickable and has a hover effect. Assigning each <tr> a unique ID does not violate the w3c rules in any way as far as I know. I've had great experience with jQuery for things like that