Search code examples
lib.web.mvc

Change subgrid icons using Lib.Web.Mvc


We've just started to play with subgrids and would like to change the icons used to expand/close the subgrid. Any help appreciated. I've found how to do it if we were just using jqGrid but we really like Lib.Web.Mvc and would prefer to stick with it. Thanks.

I've been asked to add a snippet of what I've tried, but I haven't tried anything because I don't see a property or method on any Lib.Web.Mvc object that would me allow to override these icons. Here is what I do know.

If I was going to just write JavaScript instead of using Lib.Web.Mvc I could use this documentation to achieve what I need: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:subgrid.

There was an option added in v5.0.0 to support working with subGridOptions (although I don't know if it included this particular ability), but that feature was removed in v6.0.0 and replaced with subGridHelper which is just another instance of JqGridHelper, and I don't see an parameters related to overriding the icons (https://github.com/tpeczek/Lib.Web.Mvc/blob/master/CHANGELOG.md)


Solution

  • Yes Lib.Web.Mvc currently doesn't support subGridOptions, but some settings (including icons) can be set in JavaScript after script generated by Lib.Web.Mvc. Assuming you have something like this in your view:

    var grid = new JqGridHelper<...>(
        "yourGridId",
        ...
    );
    

    You can use setGridParam after call to GetJavaScript:

    $(function() {
        @grid.GetJavaScript()
    
        $('#yourGridId').jqGrid('setGridParam', { subGridOptions: { plusicon: 'ui-icon-arrow-1-s', minusicon: 'ui-icon-arrow-1-n' } });
    });
    

    And it will give the desired result.

    Also please remember that plusicon, minusicon and openicon are taking names of classes representing jQuery UI Framework Icons (you can easily find them by using ThemeRoller). If you would want to use a custom icon, you will have to define a class which will work in that context.