Как изменить тему jqGrid?

Question

Я ищу способ изменить тему jqGrid для текущей версии. Я недавно начал использовать jqGrid в своем приложении ASP.Net MVC 2 и загрузить несколько демонстрационных решений / проектов. Я пытался изменить тему сетки, изменив тему пользовательского интерфейса javascript но это не работает для меня. Глядя на документ мне не очень помогает!

Как вы меняете тему jqGrid? Я ищу:

1. Список CSS-файлов, которые использовались для настройки пользовательского интерфейса сетки.
2. Действия по изменению темы на новую тему
3. Предпочитает ссылаться на тему через Интернет .css / .js url - для автоматического обновления темы до последней версии

Answer 1

Пользовательский интерфейс jQuery ThemeRoller предоставляет 24 темы.

1. Для изменения jqgrid тему просто загрузите Redmond (Прокрутите вниз и выберите тему, нажмите кнопку Загрузить), выбрав вкладку Gallery, затем нажмите Календарь изображение для preview the theme, затем нажмите кнопку Download для загрузки.
2. Извлеките загруженный файл jquery-ui-1.10.4.custom и вставьте его вthemes -> redmond папка.

Ниже приведены файлы для применения темы в jqgrid.

Пример:

<link rel="stylesheet" type="text/css" media="screen" href="<%=request.getContextPath()%>/themes/redmond/jquery-ui-1.10.4.custom/css/redmond/jquery-ui-1.10.4.custom.css" />
<script type="text/javascript" src="<%=request.getContextPath()%>/themes/redmond/jquery-ui-1.10.4.custom/js/jquery-1.10.2.js" ></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/themes/redmond/jquery-ui-1.10.4.custom/js/jquery-ui-1.10.4.custom.js"></script>

Изменение темы jqgridиспользуйте jquery-ui-1.10.4.custom.css, jquery-1.10.2.js, jquery-ui-1.10.4.custom.js файлов.

Шаг: 1

Шаг: 2

Answer 2

Не для тем jQueryUI, но вы можете переключаться между вариантами jQueryUI и bootstrap.Я использую бесплатную jqGrid (ветку trirand jqGrid), и вы можете настроить внешний вид с помощью двух основных параметров:

1. guiStyles (https://github.com/free-jqgrid/jqGrid/blob/master/dist/jquery.jqgrid.src.js#L600): jQueryUI, bootstrap, bootstrapPrimary, bootstrap4
2. icons: (https://github.com/free-jqgrid/jqGrid/blob/master/dist/jquery.jqgrid.src.js#L389): jQueryUI, fontAwesome, glyph