Updating individual or multiple rows with a button....

Sabier

Hello folks,

I recently came across this wondeful plugin and wish to implement it in our current project. I am using both jEditable and DataTable plugins for a DB driven table. However I have a small question relating to DB updation.

After retrieving data into a table using Oracle, I have around 5 columns of data per row that I wish to update in one go using a single submit function at the end of the table. I am new to jQuery and from what I understand from the examples, only 1 TD data at a time can be updated. I wish to extend that functionality for the entire row and by using a Submit button instead.

I would be obliged if you can provide me an example of such an operation.

Thanking you,
~Sab

allan

Hi Sab,

I don't have a working example of how this would work, but I know what you are looking for. Basically what you need to do is convert the entire row to editable elements and then submit then in one call. You can then use fnUpdate to update the entire row. I'm not sure if jEditable supports editing multiple elements at the same time to be honest, it might be an idea to ask over there. In the long run I'll look at how something a little better might be integrated into DataTables for this.

Regards,
Allan

Sabier

Hi Allan,

Thanks a lot for your advice. I'll look into it and keep you informed on the progress.

Regards,
~Sab

carteriii

Sabier and/or Allan, has anyone made any progress on this? I now find myself needing the same functionality to update a full row at once, but cannot figure out how to (using Allan's description) "convert the entire row to editable elements".

I was also looking at the form submit example (http://datatables.net/examples/api/form.html) which nicely gathers all inputs in a table, so it does seem that lots of things can be once we can convert an entire row to editable/input elements. Perhaps JEditable isn't the answer, but instead using the DataTables callbacks to insert elements into a row of td's?

The other way I've been thinking about this is to use the hidden row example (http://datatables.net/examples/api/row_details.html) to display a form with inputs immediately below the row and then submit those inputs. This has the advantage that the user will be able to see the old tr values immediately above the new input values. Right now I think this is probably my best/simplest approach, but I'd welcome an opinion before I start down this path.

allan

What I had been meaning was to loop over the cells in the row and put in INPUT elements (or SELECT or whatever) with the current value so the user can enter the information and then press the submit button. jEditable will only do one cell at a time (although it might be configurable to do more - I'm not sure!).

Using the row details option as you mention is a different interaction technique and would work quite well (if that is the interaction you want). One I've used successfully in the past is a 'lightbox' with an edit form which when submitted will update the table. Again another interaction method... :-)

Allan