2010-09-16 10 views
3

Je cherche le moyen de changer le thème de jqGrid pour la version actuelle. J'ai commencé récemment à utiliser jqGrid dans mon application ASP.Net MVC 2 et à télécharger des solutions/projets de démonstration. J'ai essayé de changer le thème de la grille en changeant le thème ui javascript mais ça ne marche pas pour moi. En regardant le document ne m'aide pas beaucoup!Comment changer le thème de jqGrid?

Comment changez-vous le thème de jqGrid? Je cherche:

  1. Liste des fichiers css utilisés pour configurer l'interface utilisateur de la grille.
  2. étapes pour changer un thème à un nouveau thème
  3. préfèrent se référer au thème par ligne Css/url .js - afin de mettre à jour le thème à la dernière version automatiquement

Répondre

5

interface utilisateur jQuery ThemeRoller fournit 24 thèmes.

  1. Pour changer le thème jqgrid il suffit de télécharger Redmond (Faites défiler et sélectionnez le thème cliquez sur le bouton Télécharger) thème en sélectionnant l'onglet Gallery puis cliquez sur Calendrier image pour l'preview the theme puis cliquez sur le bouton Download pour le téléchargement.
  2. Extrayez le fichier téléchargé jquery-ui-1.10.4.custom et collez-le sous le dossier themes -> redmond.

Voici les fichiers à appliquer dans jqgrid.

Exemple:

<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> 

Changer le thème jqGrid utiliser jquery-ui-1.10.4.custom.css,jquery-1.10.2.js,jquery-ui-1.10.4.custom.js fichiers.

Étape: 1

themeroller

Étape: 2

themes

2

Pas pour les thèmes jQueryUI, mais vous pouvez basculer entre jQueryUI et variantes bootstrap. J'utilise jqGrid libre (une branche de trirand jqGrid), et vous pouvez régler le look-and-feel avec deux options principales:

  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
Questions connexes