Sticky Header widget clones ID

[ptepper]

I just noticed that the sticky header widget is creating two elements on the page with the same ID. I see you did this to maintain styling, but this is a problem in my case, as having two elements in the DOM with the same ID breaks other code. Is there any way around this, other than changing your code to make it assign a new ID when it clones the table?

[ptepper]

For now I replaced your line in jquery.tablesorter.widget.js:

t2 = wo.$sticky = $table.clone(), // clone table, but don't remove id... the table might be styled by css

with this:

t2 = wo.$sticky = $table.clone().attr('id', $table.attr("id")+"Clone"),

I realize there is a compromise between keeping the user's style and not breaking the DOM but making them style the table with a class instead of by ID, but I don't think it makes sense to break the DOM in order to preserve styling by ID. In this case styling should be done by class and just documented in the widget docs. If you wanted to add more code you could move the styling for this ID into a class and apply it to both elements, but I don't think that's necessary.

Hope you don't mind the feedback, the code still works great :)

[Mottie]

HI @ptepper!

Yeah, that was a dilemma for me when writing the widget. I think at this point I'll just add an option that allows you to change the id of the clone.

Thanks!

[Mottie]

In verison 2.9.0, a new option was added to the sticky header widget named stickyHeaders_cloneId. It contains a string suffix to add to any table id. Default is -sticky.

Thanks for reporting this issue!