Change jquery grid theme (ui.jqgrid.css location) in struts2

Question

I have a jquery grid component on my webpage. I want to change css file, that it uses. I set it in jj:head tag:

<sj:head jqueryui="true" jquerytheme="custom-theme" customBasepath="css"/>

And I see this html tag on my webpage:

<link type="text/css" href="css/custom-theme/jquery-ui.css" rel="stylesheet" id="jquery_theme_link">

Styles files path for jquery-grid component is

<link rel="stylesheet" type="text/css" href="/appname/struts/themes/ui.jqgrid.css">

I want this path to be like this:

<link rel="stylesheet" type="text/css" href="css/custom-theme/ui.jqgrid.css">

Where can I set struts jquery grid css file location?

Answer 1

I had the same trouble, the solution was to override the css once the grid finish loading.

<sjg:grid 
    ...
    onCompleteTopics="loadCustomCss"
    ...
/>

Then in your jsp

<script>
    $.subscribe('loadCustomCss', function(event,data){
         $('head').append( $('<link rel="stylesheet" type="text/css" />').attr('href', '../css/grid.css') );
    });
</script>

Where grid.css is your custom css, you can copy the css provided by the plugin and this is especially useful when you had it loaded as a Maven dependency.

Answer 2

You can do as:

<sjg:grid ... onGridCompleteTopics="myCssLoaderTopic" ....> 

An then in your topics

<script>
    $.subscribe('loadCustomCss', function(event,data){            
        $.struts2-jquery.requireCss(cssFile, basePath); 
    });
</script>

Please refer to: https://groups.google.com/forum/#!topic/struts2-jquery/Aurqeuwhiuo