I discovered that because my jQuery selector was using a CSS class name identifier, the plugin was getting confused, by creating another gridview with the same class (almost like a recursion error by modifying objects in the global namespace)
changing the jQuery selector to be by gridview ID's fixed the issue
function LoadScrollPopupOverridesBehavior() {
$('#MainContent_GridViewPopupWithOverride').Scrollable({
ScrollHeight: 350,
Width: 733
});
$('#MainContent_GridViewPopupWithoutOverride').Scrollable({
ScrollHeight: 350,
Width: 733
});
}
The scrollable plugin includes the following lines to copy the attributes from the original gridview to the new header gridview, notice it does not copy the id
thus, calling the .scrollable() by id
seems to be the unofficial supported way of using the plugin.
for (i = 0; i < grid.attributes.length; i++) {
if (grid.attributes[i].specified && grid.attributes[i].name != "id") {
table.setAttribute(grid.attributes[i].name, grid.attributes[i].value);
}
}