JavaScript simple grid?

Question

I need a simple (HTML/JavaScript) working example for the following objective. In a table with three columns and 5 rows the first column is a text box. The second column is a button/link called EDIT and third column is button/link called SAVE.

When I click on EDIT for say the 3rd row the textbox in 3rd row should become editable. I enter text, then click SAVE. It should revert to read-only. The premise is it should be editable row-wise.

Can you provide a working example? Or point me to a relevant resource?

Answer 1

See YUI DataTable. Not exactly what you asked for, but it might make a reasonable starting point.

Answer 2

I would suggest looking into a framework. Believe me, unless your purpose behind this is learning how something works (I don't get that impression from your question wording), you will find it much harder implementing from scratch than using a framework.

I would suggest looking at the Ext Framework (my personal preference) as they have a very simple EditableGrid that is quick to setup and use.