`
a3mao
  • 浏览: 562914 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jqGrid学习

    博客分类：
  • Work
jQueryCSSUIXHTMLHTML 
阅读更多
jqGrid学习之 ------------- 安装

jqGrid安装很简单，只需把相应的css、js文件加入到页面中即可。
按照官网文档：
    *
      /myproject/css/
          o
            ui.jqgrid.css
          o
            /ui-lightness/
                +
                  /images/
                +
                  jquery-ui-1.7.2.custom.css
    *
      /myproject/js/
          o
            /i18n/
                +
                  grid.locale-bg.js
                +
                  list of all language files
                +
                  ….
          o
            Changes.txt
          o
            jquery-1.3.2.min.js
          o
            jquery.jqGrid.min.js

目录结构如上。
在页面中写法： 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>
 
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.7.1.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="js/src/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="js/src/css/jquery.searchFilter.css" />
 
<style>
html, body {
    margin: 0;
    padding: 0;
    font-size: 75%;
}
</style>
 
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/src/grid.loader.js" type="text/javascript"></script>
 
</head>
<body>
...
</body>
</html>

需要说明的是，jquery-ui的字体大小与jqgrid字体大小不一致，故需要在页面上在加上一段
style来指定页面上文字大小。
分享到：
| jQery最佳实践
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jqGrid学习笔记1 - - - - jqGrid英语PDF文档

    这个学习笔记主要围绕“jqGrid学习笔记1”展开，内容来源于jqGrid的英文PDF文档，结合了源码解析和实用工具的介绍。 首先，jqGrid支持多种数据源，包括JSON、XML、HTML、CSV等，这使得它能灵活地与各种后端服务进行...

    jqgrid 学习参考

    "jqgrid 学习参考"的主题旨在帮助初学者快速理解和掌握 jqGrid 的基本用法和高级特性。 首先，让我们从基础开始。要使用 jqGrid，你需要在页面中引入 jQuery 和 jqGrid 的 JavaScript 文件。这些文件可以从官方网站...

    jqgrid学习

    jqGrid 是一个强大的 jQuery 插件，用于在网页上创建、操作和展示数据表格。它提供了丰富的功能，如数据分页、排序、过滤、编辑、导入...通过学习和实践，我们可以利用它创建出交互性强、用户体验良好的数据管理界面。

    jqgrid学习笔记

    jqGrid 是一个强大的 jQuery 插件，用于创建交互式的表格，它允许用户在网页上轻松地展示、操作和检索数据。以下是对 jqGrid 的详细解释： 1. **安装jqGrid**： 安装 jqGrid 非常简单，只需要将相关的 CSS 和 ...

    jqgriddemo.zip

    这个离线 demo 打包非常适合开发者在没有网络连接的情况下学习和测试 jqGrid。 jqGrid 提供了丰富的特性，如数据分页、排序、搜索、过滤、编辑等，支持 JSON、XML、CSV 和 HTML 数据源，同时兼容多种数据库，包括 ...

    Jquery Jgrid使用手册

    一、jqGrid学习 JqGrid的基础使用涉及到HTML元素的初始化，通常通过jQuery选择器选中表格元素，然后调用jqGrid函数进行初始化。配置参数可以设置表格的列、数据源、样式等特性。 二、jqGrid学习之——皮肤 JqGrid...

    jquery.jqGrid.min.js 自家博客专用

    博客专用: Jqgrid学习笔记__01__初来乍到 很多时候在网上下载一段代码，结果引用的CSS和JS文件不知道从哪里弄，结果上网下载，不是版本不对，就是完全不对。这里的JS是有对应的代码段的。请参考博客 ====&gt; Jqgrid...

    ui.jqgrid.css 自家博客专用

    博客专用: Jqgrid学习笔记__01__初来乍到 很多时候在网上下载一段代码，结果引用的CSS和JS文件不知道从哪里弄，结果上网下载，不是版本不对，就是完全不对。这里的CSS是有对应的代码段的。请参考博客 ====&gt; Jqgrid...

    free-jqgrid-4.15.5.tgz

    本文将深入探讨free-jqgrid-4.15.5版本，此版本包含了所有的js和css文件，为开发者提供了完整的jqGrid学习和应用资源。 一、jqGrid概述 jqGrid是一款基于jQuery的开源数据网格组件，它允许用户在网页上创建交互式...

    JqGrid插件+JqGridDemo+JqGrid主题

    JqGrid是一款强大的JavaScript表格插件，用于在Web应用程序中展示和操作数据。...通过深入学习和实践"JqGrid插件+JqGridDemo+JqGrid主题"，开发者可以提升其在前端开发中的数据处理能力，创建出更富交互性的网页应用。

    jqGrid 学习笔记整理——进阶篇(一 )

    jqGrid 是一个强大的 jQuery 插件，用于创建交互式的表格，具有数据检索、排序、过滤、编辑等多种功能。本篇文章将深入探讨 jqGrid 的进阶使用，特别关注如何在浏览导航栏添加自定义按钮。 首先，jqGrid 的基本结构...

    Java中jqGrid 学习笔记整理——进阶篇(二)

    在本篇Java中jqGrid的学习笔记整理中，我们将聚焦于jqGrid与后台Java服务的数据交互。jqGrid是一款强大的JavaScript库，用于创建动态、交互式的表格，而这里的进阶篇(二)将涉及到如何通过Java后端来提供数据支持。 ...

    JQgrid如意学习博客

    JQgrid如意学习博客

    JqGrid中文API文档

    JqGrid是一款强大的JavaScript数据网格组件，用于在Web应用...通过深入学习JqGrid中文API文档，开发者可以充分利用其强大功能，创建功能丰富的数据展示和管理界面。结合提供的示例代码，实践应用将变得更加直观和便捷。

    jqGrid demo （完整版）

    此 demo 是一个学习 jqGrid 的良好起点。通过分析代码和尝试修改，你可以深入了解 jqGrid 的工作原理，并提升你在网页数据管理方面的技能。 通过这个 jqGrid 完整版 demo，开发者不仅可以学习到 jqGrid 的基本用法...

    jqGrid中文文档.doc

    对于 jQuery 的学习，可以访问官方站点 jquery.com 获取相关资料。 jqGrid 的系统需求主要包括以下几个方面： 1. 浏览器支持：jqGrid 兼容多种浏览器，如 Mozilla Firefox、Safari、Google Chrome、Opera 以及 ...

    jqgriddemo,样式漂亮，可以直接使用

    通过深入学习和实践“jqgriddemo”，不仅可以提升对jqGrid的理解，还能为实际项目开发积累宝贵经验。对于前端开发者而言，掌握jqGrid这样的数据网格组件，无疑会提高工作效率，为用户提供更优质的交互体验。

    jqGrid5.5 版本

    jqGrid是一款功能强大的JavaScript数据网格...学习jqGrid5.5不仅可以提高数据展示和管理的效率，还能提升开发者的前端技能。通过深入理解和实践，开发者可以充分利用jqGrid的强大功能，为用户带来更优质的交互体验。

Magicbox
Global site tag (gtag.js) - Google Analytics