fnUpdate alternative?

sronsiek

Hi,

I have a table column which contains multiple editable elements,
eg several jeditable inplace-edits with anchors, drop down select option
and checkboxes.

The cell is intially filled via a json request (in fact the whole table, via aaData),
after which bindings are applied to all the elements.

Now in order to maintain sortability, I have to call fnUpdate - and need to replace
the entire cell contents. This nukes all the bindings which then need to be re-applied.

If I update the cell using jquery selector, the bindings remain, but the data tables
internals do not get updated and sorting is broken.

Is there not a more convenient method that does not break the bindings?

Perhaps I can update a value in the data tables internal struct and call fnDraw after?

cheers,
S

sronsiek

The sort of thing I had in mind:

[code]
$(oSettings.aoData[ aPos[0] ].nTr).find('td:eq(5) a').html( 'Some String' )
oTable.dnDraw()
[/code]

This code updates the data without breaking bindings, but still sorting is broken ;(

allan

Currently no - there is no alternative API method that will effect only the internal data structure and not the DOM, but it would certainly be possible to build a plug-in method do so. Have a look at the "this.fnUpdate: function" code in DataTables core to see how it does the internal data store update, then you could manipulate that (oSettings.aoData[]._aData is what you want) and also update your HTML, and that would do it.

Allan

sronsiek

Thanks Allan! Thought I'd feedback the soln in case someone else is interested.
This code is from the jeditable 'callback' callback. jeditable has already updated the html
in the DOM, so here we just need to update the _aData array. This is refers to the simpler
case where a table cell contains an html anchor (possibly with attributes), and the anchor
contains the editable text. 'this' refers to the anchor in th callback. sValue is the modified
string (passed into the callback by jeditable).

[code]
var aPos = oTable.fnGetPosition( $(this).parents('td').get(0) )

// Extract the current html string, update with the help of jQuery, set the result in _aData array:
var html_str = oSettings.aoData[ aPos[0] ]._aData[ aPos[1]+1 ]
oSettings.aoData[ aPos[0] ]._aData[ aPos[1]+1 ] = $( html_str ).html( sValue ).get(0).outerHTML

oTable.fnDraw()
[/code]