Fixed columns + ReactJS (problem with cloned table)

brj

Since extension copies table to fixed column in some way, it also clones the data-reactid attribute, which react uses for unique identification of dom elements.
And React gives the next error:
Uncaught Invariant Violation: ReactMount: Two valid but unequal nodes with the same data-reactid

I think you could restrict the list of copied attributes, while cloning. At least, that will make minus one problem with react js.

Thank you in advance!

p.s.
would be nice to add :visited css for anchors in discussion search list. That worked for me:

#searchResults div.resultsWrapper div.results a.result:visited, 
#searchResultsStatic div.resultsWrapper div.results a.result:visited {
    color: #630C8E ;
}

p.p.s.
Allan, you have the best documentation i ever saw (!) :)

brj

Solved this way:

in component's componentDidMount method (after dom is loaded and updated, and table is initialized) put a line

$('[data-reactid*="tbl_table"]:not([id])')

Selectors:

• [data-reactid*="tbl_table"] : tbl_table was the props: key in my komponent (so data-reactid looked like '.0.{....}.$tbl_table').
• [id] - is a flag that marks, that original table (not the copied header) is having id attribute (in current dataTables version). So, :not([id]) will point to the header.

Hope that this solution will work for a long time and probably help someone..

p.s. If contributors will notice this problem and remove redundant attributes during cloning to fixed header and columns.

brj

i've made an example:

http://live.datatables.net/tosogala/1/edit

Please note attributes of tables (in scrollbody and scrollhead).
I suppose it's just ok to sanitize attributes, which dataTables is cloning.