今天在做jqGrid例子时,发现Array Data有个问题,写下来问问大家
<!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=gbk" />
<title>jqGrid Demos</title>
<link rel="stylesheet" type="text/css" media="screen" href="themes/redmond/jquery-ui-1.7.1.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="themes/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="themes/ui.multiselect.css" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
<script src="js/jquery.layout.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/jquery.tablednd.js" type="text/javascript"></script>
<script src="js/jquery.contextmenu.js" type="text/javascript"></script>
<script src="js/ui.multiselect.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#list4").jqGrid({
datatype: "local",
height: 250,
colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
colModel:[
{name:'id',index:'id', width:60, sorttype:"int"},
{name:'invdate',index:'invdate', width:90, sorttype:"date"},
{name:'name',index:'name', width:100},
{name:'amount',index:'amount', width:80, align:"right",sorttype:"float"},
{name:'tax',index:'tax', width:80, align:"right",sorttype:"float"},
{name:'total',index:'total', width:80,align:"right",sorttype:"float"},
{name:'note',index:'note', width:150, sortable:false}
],
multiselect: true,
caption: "Manipulating Array Data"
});
var mydata = [
{id:"1",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},
{id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"},
{id:"3",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"},
{id:"4",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},
{id:"5",invdate:"2007-10-05",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"},
{id:"6",invdate:"2007-09-06",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"},
{id:"7",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},
{id:"8",invdate:"2007-10-03",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"},
{id:"9",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}
];
for(var i=0;i<=mydata.length;i++)
//jqgrid_demo35中用这个方法,发现不能加载数据
// jQuery("#list4").jqGrid('addRowData',i+1,mydata[i]);
//我改用以下方法就可以成功加载,不知为什么?还请高手指点???
jQuery("#list4").addRowData(i+1,mydata[i]);
});
</script>
<body>
<table id="list4"></table>
</body>
</html>
分享到：
相关推荐
jqGrid是一款基于jQuery的数据网格插件，用于在网页上展示和操作数据，具有丰富的功能，如排序、分页、编辑、搜索等。在本例中，我们关注的是jqGrid的分组、合计以及表头合并的功能，这些都是在处理大数据表格时非常...
6. **编辑与操作**：提供行内编辑、弹出编辑窗口以及新增、删除记录的功能，通过`editData`、`delData`等参数设置编辑和删除的服务器端URL。 7. **自定义行为**：可以通过事件处理函数（如`beforeSelectRow`、`...
在这个"jqGrid的asp.net例子"中，我们将深入探讨如何将jqGrid与ASP.NET框架结合，以及与SQL Server 2008数据库（具体示例使用AdventureWorks数据库）进行交互。 首先，ASP.NET是微软开发的一种Web应用程序框架，...
jqGrid是一款功能强大的JavaScript数据网格插件，广泛用于Web应用程序中展示、操作和管理大量数据。...提供的相关例子可以帮助我们更好地理解和运用jqGrid的各种功能，从而在实际项目中发挥其优势。
总的来说，"lotus domino jqgrid显示视图例子"是一个将Lotus Domino的视图数据与JqGrid的交互式表格功能相结合的应用实例。这个过程涉及到前后端数据交互、JSON格式化、JqGrid的配置和操作，以及Lotus Domino的代理...
查阅官方文档（如http://www.trirand.com/blog/）和社区资源（如提供的参考网址http://blog.mn886.net/jqGrid/）是非常重要的，它们提供了详细的API参考和示例代码，有助于解决开发过程中遇到的问题。 通过这个完整...
这个"第一个jqGrid例子"旨在帮助初学者理解和应用jqGrid的基本功能。jqGrid提供了丰富的特性和配置选项，使得数据的展示、排序、筛选、编辑和页面分页变得简单易行。 首先，jqGrid的核心功能是数据的展示。通过使用...
在这个"jqgrid加载本地数据并且分页例子"中，我们将深入探讨如何利用jqGrid实现从本地数据源加载数据并进行分页显示。 首先，要理解jqGrid的工作原理。它基于jQuery库，通过HTML表格元素来渲染数据，并通过AJAX从...
在这个“jqGrid使用XML數據源例子”中，我们将探讨如何配置jqGrid来从XML文件中获取并显示数据。 首先，我们需要了解XML（Extensible Markup Language）是一种用于标记数据的格式，它被广泛用于数据交换和存储。XML...
在这个“JqGrid小例子 vs2010+mvc”中，我们将探讨如何在Visual Studio 2010环境下，利用ASP.NET MVC框架来集成和应用JqGrid。 首先，我们需要了解**ASP.NET MVC**。这是一个模型-视图-控制器（Model-View-...
ASP.NET与jqGrid结合使用是Web开发中一种常见的数据展示技术。jqGrid是一个强大的JavaScript库，用于在网页上创建交互式的...通过研究这些文件，可以更好地理解和应用asp.net jqgrid的例子，解决实际项目中类似的问题。
jqGrid是一款功能强大的JavaScript表格插件，用于在Web页面中展示和操作数据。它基于jQuery库，提供了丰富的功能，如数据分页、排序、搜索、编辑等，支持JSON、XML、CSV等多种数据格式，适用于创建交互式的动态数据...
在这个“jqGrid dialog 例子”中，我们看到 jqGrid 被用来展示和处理数据，同时结合了 dialog 弹出层来执行增删改操作，从而提供了一个用户友好的交互体验。 首先，让我们详细了解一下 jqGrid 的核心功能： 1. ...
**jqGrid JSP示例详解** jqGrid是一款强大的JavaScript数据网格插件，它与jQuery库兼容，用于在网页上展示和操作数据。本教程将基于JSP（Java Server Pages）环境，详细介绍如何集成并使用jqGrid，为Java开发者提供...
**MVC 模式与 JqGrid 结合详解** MVC（Model-View-Controller）是一种软件设计模式，常用于创建可维护、可扩展的Web应用程序。它将业务逻辑（Model）、用户界面（View）和应用程序控制流程（Controller）分离，使得...
这个"jqGrid增删改查例子"是一个实际应用示例，展示了如何结合Struts2框架和MySQL数据库实现一个完整的CRUD（创建、读取、更新、删除）功能的前端表格。 首先，让我们了解一下jqGrid的核心功能： 1. 数据展示：...
JqGrid是一款强大的JavaScript表格插件，用于在Web应用程序中展示和操作数据。它基于jQuery库，提供了丰富的功能，如数据排序、筛选、分页、编辑、添加、删除和保存等，极大地增强了网页中表格的交互性和数据管理...
** jqGrid 简介** jqGrid 是一个基于 jQuery 的数据网格插件，它提供了丰富的功能，用于在网页上展示和操作数据。jqGrid 支持分页、排序、筛选、编辑、添加、删除和查看数据，使得在 Web 应用程序中构建交互式表格...