CSS Styles not updated on subsequent calls

[kryten87]

I'm using the grid in an HTML snippet that's returned by an AJAX call. On the first call, all is correct. On the second and subsequent calls, the CSS does not appear to be rewritten correctly.

Here's how I noticed it:

On the first call, the grid had 6 columns corresponding to months. The widths of the columns were set correctly.

On the second call, the grid had more than 6 columns. The widths of all columns after the 6th were not set.

A little digging revealed that the CSS styles for div.mgCl6, div.mgCl7, etc. were not set in style#store-history-gridSS.

My solution: add some JS code to explicitly remove the previous style sheet. ( Note that I'm using jQuery here ).

    // remove any styles that may already exist
    $('style#store-history-gridSS').remove();
    // Render the grid
    new Grid('store-history-grid', {
        srcType: 'dom',
        srcData: 'store-history-table',
        allowGridResize : true,
        allowColumnResize : true,
        allowClientSideSorting : true,
        allowSelections : true,
        allowMultipleSelections : true,
        fixedCols : 1,
        supportMultipleGridsInView : false
    });

Seems like a pretty easy patch, but I'm not sure where to make the change.