2010-09-16 6 views
3

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

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

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

ответ

5

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

themeroller

Шаг: 2

themes

2

Не для темы jQueryUI, но вы можете переключаться между jQueryUI и бутстраповских вариантов. Я использую бесплатный 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
Смежные вопросы