How to change color theme and font size of jqgrid

廉价感情. 提交于 2019-12-12 01:09:37

问题


I have created application in MVC 4, jquery and jqgrid.

I have used jqgrid in one of page as below:

          $('#g).jqGrid({
            ajaxGridOptions: {
                error: function () {
                    $('#g')[0].grid.hDiv.loading = false;
                    alert('An error has occurred.');
                }
            },
            url: '@Url.Action("Getvalues", "cntrollName")/' + 0,
            postData: { ID: rowID },
            datatype: 'json',
            jsonReader: { root: 'List', page: 'Page', total: 'TotalPages', records: 'TotalCount', repeatitems: false, id: 'ID' },
            mtype: 'GET',
            colNames: ['GrdID', Name],
            colModel: [
                { name: ID, index: ID, hidden: true },
                { name: 'FullName', index: 'FullName', width: 150 }
                                ],
            pager: $('#g),
            sortname: ID,
            rowNum: 10,
            width: '525',
            height: '100%',
            viewrecords: true,
            beforeSelectRow: function (rowid, e) {
                                   return true;
            },
            sortorder: 'desc'
        }).navGrid('#g, { edit: false, add: false, del: false, search: false, refresh: false });

Please share me how i could change color and font size of jqgrid.

For now, it just shows default light blue theme and its default font size.

Thanks


回答1:


jqGrid are based on jQuery UI Theme. To change colors you can either download the theme (see here and choose the theme at the dropdown at the bottom of the page) or customize your own theme here. In the way you can easy change all colors.

To change the font size you will have to overwrite some CSS styles defined in ui.jqgrid.css. Just search for font-size and height with pixel values. If you will need to increase the font size you will need to increase some height values of grid's parts.



来源:https://stackoverflow.com/questions/21399581/how-to-change-color-theme-and-font-size-of-jqgrid

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!