如何更改jqGrid的主题?

发布于 2024-09-24 03:12:18 字数 393 浏览 2 评论 0原文

我正在寻找更改当前版本的 jqGrid 主题的方法。 我最近开始在 ASP.Net MVC 2 应用程序中使用 jqGrid 并下载一些演示解决方案/项目。我尝试通过更改主题 ui javascript 来更改网格的主题 但这对我不起作用。查看文档对我没有多大帮助!

你如何改变 jqGrid 的主题? 我正在寻找:

  1. 用于设置网格 ui 的 css 文件列表。
  2. 将主题更改为新主题的步骤
  3. 最好通过在线 .css/.js url 引用主题 - 以便自动将主题更新到最新版本

I'm looking for the way to change jqGrid theme for the current version.
I've started to use jqGrid in my ASP.Net MVC 2 application recently and download some demo solution/projects. I tried to change the theme of the grid by changing the theme ui javascript
but it doesn't work for me. Looking at the document doesn't help me much!

How are you changing the jqGrid's theme?
I'm looking for:

  1. List of css files that used to set up the ui of the grid.
  2. Steps to change a theme to a new theme
  3. Prefer to refer to the theme by online .css/.js url - so as to update the theme to latest version automatically

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

雨夜星沙 2024-10-01 03:12:18

jQuery 用户界面 ThemeRoller 提供 24 个主题。

  1. 要更改 jqgrid 主题,只需下载 Redmond(向下滚动并选择主题,然后单击“下载”按钮)主题,选择图库选项卡,然后单击日历图像进行预览主题,然后单击下载按钮进行下载。
  2. 解压下载的文件 jquery-ui-1.10.4.custom 并将其粘贴到 themes -> 下雷蒙德 文件夹。

以下是在 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

主题

jQuery user interface ThemeRoller provides 24 themes.

  1. For changing jqgrid theme simply download Redmond(Scroll down and select theme click Download button) theme by selecting Gallery tab then click on Calendar image for preview the theme then click on Download button for downloading.
  2. Extract the downloaded file jquery-ui-1.10.4.custom and paste it under themes -> redmond folder.

Below are the files to apply theme in jqgrid.

Example:

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

Change jqgrid theme use jquery-ui-1.10.4.custom.css, jquery-1.10.2.js, jquery-ui-1.10.4.custom.js files.

Step: 1

themeroller

Step: 2

themes

回眸一笑 2024-10-01 03:12:18

不适用于 jQueryUI 主题,但您可以在 jQueryUI 和 bootstrap 变体之间切换。我使用免费的 jqGrid (trirand jqGrid 的一个分支),您可以使用两个主要选项调整外观:

  1. guiStyles (https://github.com/free-jqgrid/jqGrid/blob/master/dist/ jquery.jqgrid.src.js#L600):jQueryUIbootstrapbootstrapPrimarybootstrap4
  2. 图标:(https://github.com/free-jqgrid/jqGrid/blob/master/dist/jquery.jqgrid.src.js#L389): jQueryUI, fontAwesome字形

Not for jQueryUI themes, but you can switch between jQueryUI and bootstrap variants. I'm using free jqGrid (a branch of trirand jqGrid), and you can tune the look-and-feel with two main options:

  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
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文