今天图老师小编给大家精心推荐个Gird组件 Part-3:范例RSSFeed Viewer教程，一起来看看过程究竟如何进行吧！喜欢还请点个赞哦~
【 tulaoshi.com - Web开发 】
原文地址 文章日期：2006/09/04
（本文来源于图老师网站，更多请访问http://www.tulaoshi.com/webkaifa/）新组件Gird包含了许多的类和继承方法。如果读者不是太熟悉的面向对象开发的话，可能会对一个变量如何从某个类得到继承的方法感到困惑，用起GIRD来感到困难。在YAHOO.ext.gird包中，大多数类是设计成为“即插即用plug and play”的,可扩展的extended和可自定义的customized,能以最小量的代码插入轻松到web程序中。
要测试和创建一个实现gird的范例，我决定做一个简单的，只有一页的RSS种子采集器RSS Feed Viewer。整个程序写了100行代码而其中有20行是关于gird的。这个范例说明了gird的一些典型功能，如Ajax loading,预处理（preprocessing）和自定义渲染（custom rendering）
这里嵌入了个迷你型程序（用iframe）
我一步一步手把手带你进入GIRD,还会支持哪些是关键的地方，哪些不是。
Step 1 创建柱模型ColumnModel
var myColumns = [ {header: "Title", width: 350, sortable: true}, {header: "Date", width: 125, sortable: true, renderer: formatDate}];var colModel = new YAHOO.ext.grid.DefaultColumnModel(myColumns);GRID从柱模型中取得某一列的信息。在这个例子我们调用一个默认的柱模型（称DefaultColumnModel）,一个包含所有相关的信息的对象。对象的属性如下：
header: - 表头 width: - 宽度 sortable: - true=可排序 renderer: - 指定渲染方式。调用函数参数为 (value, rowIndex, columnIndex)，并由函数返回（return）值来显示到单元格cell中。 sortType: - 指定排序方式。参见文档资料，有5到6种的转换方式。除header和width其它为可选的
创建DataModel数据模型
（本文来源于图老师网站，更多请访问http://www.tulaoshi.com/webkaifa/）var schema = { tagName: 'item', id: 'use-index', fields: ['title', 'pubDate']};this.dataModel = new YAHOO.ext.grid.XMLDataModel(schema);this.dataModel.addPreprocessor(1, parseDate); //列1是日期，先预处理一下this.dataModel.onLoad.subscribe(this.onLoad, this, true);this.dataModel.onLoadException.subscribe(this.showError, this, true);this.dataModel.setDefaultSort(colModel, 1, 'ASC');DataModel是GIRD的数据
来源:http://www.tulaoshi.com/n/20160219/1594254.html
看过《Gird组件 Part-3:范例RSSFeed Viewer》的人还看了以下文章 更多>>
