Specific/Simple best practice question (web application)

[KevySaysBeNice]

Hi all!

I have a simple best practice question. This will probably seem very trivial and stupid, but I'm honestly not sure about the best way to do this:

Say I have a web application that tracks tasks, like a todo list web application. I have a bunch of lists that have titles like "Things to Do" (etc), and my web application "front page" has this list, which shows the titles. Clicking on a title brings you to a page of the tasks for that list. In a DB, each list has a unique ID. The URL when you're editing a task would look something like:

http://www.domain.com/edit-list/9/Things-to-Do
(where 9 is the ID of the list)

I have a "save list" button, that when clicked saves any changes I made to the list. I want to make an AJAX call to save the list. SO, I make a JSON object with the change I made and pass that in, BUT (Now, here is the question) I also need to pass in the ID of the list.

I could:
1) use JS to parse/pull the ID of the list from the URL (which would require client side parsing and would break things if I changed how the URLs were written)
2) Add a hidden form field somewhere with the list ID (which may/may not be a bad practice?)
3) Some other option

So, maybe a lot of typing for a simple question, but what would you do?

Thanks guys!

 

[KevySaysBeNice]

Oh, btw, I'm leaning towards using hidden form fields, but again I figured I'd check to see what people considered to be a "best practice" - sometimes I think that using hidden form fields can be a lazy way of fixing something. I worked for a company a bit ago that would have 20-30 hidden form fields on every page, which maybe was OK, but it sure seemed "dirty"

 

[Sgraffite]

I did something similar I believe, and the best way I found to do it was to dump the list as a JSON object on the page.

I used to use hidden fields, but that can get messy and changing the html layout of the page can break them depending how you are referencing them via the DOM. I found using JSON objects much simpler to work with, and more flexible.

I'm not sure if this applies to what you are doing, but it worked for me.

 

[-BokkeN-]

POST: http://www.domain.com/edit-list/${LIST_ID}

Just pull the id out of the URL, that's the easiest way to do this.

 

[Lunknumb]

I'm in no way a web programmer, but why not just render the id directly into the click event of your save button? (might be nasty to some?) Assuming you render the button together with the list. At least there's no dependencies on URL's or additional elements on the page.

//something like
$('#saveButton').click( save_stuff );

// becomes 
$('#saveButton').click(function() { save_stuff(42); } );

function save_stuff(id) {...}

 

[KevySaysBeNice]

I'm in no way a web programmer, but why not just render the id directly into the click event of your save button? (might be nasty to some?) Assuming you render the button together with the list. At least there's no dependencies on URL's or additional elements on the page.

//something like
$('#saveButton').click( save_stuff );

// becomes 
$('#saveButton').click(function() { save_stuff(42); } );

function save_stuff(id) {...}

Well, the issue with this is that it would (feel free to correct me if I'm wrong!) disrupt the JS/PHP separation. I have a JS file that I include, and while I could add PHP I'd prefer to have a separation between the two.

 

[Lunknumb]

Well, you need to inject it somehow. JS/PHP separation is all fine and dandy, but doing it to the degree where stops you from passing data from one to the other seems a bit counter productive.

You need to either include it in a hidden element om the page, or render it into a script or variable. Both are normal practices, and you aren't getting more dirt on your hands than you have to.

 

[KevySaysBeNice]

Well, in the end I decided to just make a hidden variable. I can/might change that sometime in the future, but for now it works. It's actually nice, because I'm using CodeIgniter and it turns out you can include an array for hidden data, like this:

$hidden = array('id' => $id, 'update_type'=> 2);
echo form_open('list/updater/' . $id, '', $hidden);

 

[KingKaeru]

would a form submit make more sense for the change instead of an ajax call?

if you insist on using ajax, layer it on top of a form submit. add the id as a hidden form field so that it gracefully degrades back to a form submit if javascript is off