YUI datatable 源码

Chenyunshi — Fri, 30 Oct 2009 05:49:00 GMT

摘要: Java:Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->package org.diegochen.yuitut.base.controller;import java.io.PrintWriter;import java.util.List;imp... 阅读全文

Chenyunshi 2009-10-30 13:49 发表评论

YUI 第一篇 : Yahoo global object 翻译

Chenyunshi — Thu, 09 Oct 2008 09:25:00 GMT

简介

Yahoo global object 提供namespace机制和封装了一些好用的方法. js名称为yahoo.js ,使用YUI前必须先引入这个js,且应该最先加载.

源文件

常用方法列举如下:

YAHOO.namespace

避免js全局变量污染的好办法,用法如下:

// Creates a namespace for "myproduct1"
YAHOO.namespace ("myproduct1");
YAHOO.myproduct1.Class1 = function(info) {
alert(info);
};

// Creates a namespace for "myproduct2", and for "mysubproject1"
YAHOO.namespace ("myproduct2.mysubproject1");
YAHOO.myproduct2.mysubproject1.Class1 = function(info) {
alert(info);
};

YAHOO.lang

提供了一些简便易用方法,如下:

// true, an array literal is an array
YAHOO.lang.isArray([1, 2]);

// false, an object literal is not an array
YAHOO.lang.isArray({"one": "two"});

// however, when declared as an array, it is true
function() {
    var a = new Array();
    a["one"] = "two";
    return YAHOO.lang.isArray(a);
}();

// false, a collection of elements is like an array, but isn't
YAHOO.lang.isArray(document.getElementsByTagName("body"));

// true, false is a boolean
YAHOO.lang.isBoolean(false);

// false, 1 and the string "true" are not booleans
YAHOO.lang.isBoolean(1);
YAHOO.lang.isBoolean("true");

// null is null, but false, undefined and "" are not
YAHOO.lang.isNull(null); // true
YAHOO.lang.isNull(undefined); // false
YAHOO.lang.isNull(""); // false

// a function is a function, but an object is not
YAHOO.lang.isFunction(function(){}); // true
YAHOO.lang.isFunction({foo: "bar"}); // false

// true, ints and floats are numbers
YAHOO.lang.isNumber(0);
YAHOO.lang.isNumber(123.123);

// false, strings that can be cast to numbers aren't really numbers
YAHOO.lang.isNumber("123.123");

// false, undefined numbers and infinity are not numbers we want to use
YAHOO.lang.isNumber(1/0);

// true, objects, functions, and arrays are objects
YAHOO.lang.isObject({});
YAHOO.lang.isObject(function(){});
YAHOO.lang.isObject([1,2]);

// false, primitives are not objects
YAHOO.lang.isObject(1);
YAHOO.lang.isObject(true);
YAHOO.lang.isObject("{}");

// strings
YAHOO.lang.isString("{}"); // true
YAHOO.lang.isString({foo: "bar"}); // false
YAHOO.lang.isString(123); // false
YAHOO.lang.isString(true); // false

// undefined is undefined, but null and false are not
YAHOO.lang.isUndefined(undefined); // true
YAHOO.lang.isUndefined(false); // false
YAHOO.lang.isUndefined(null); // false

YAHOO.lang.hasOwnProperty

检查某个对象是否有某属性

// this is what we are protecting against
Object.prototype.myCustomFunction = function(x) {
    alert(x);
}

var o = {};
o["foo"] = "bar";
o["marco"] = "polo";

// this is where we need the protection
for (var i in o) {
    if (YAHOO.lang.hasOwnProperty(o, i)) {
        alert("good key: " + i);
    } else {
        alert("bad key: " + i);
    }
}

YAHOO.lang.extend

提供了继承机制.(译者注:js使用继承还是有一定风险,建议酌情使用.)

YAHOO.namespace("test");

YAHOO.test.Class1 = function(info) {
    alert("Class1: " + info);
};

YAHOO.test.Class1.prototype.testMethod = function(info) {
    alert("Class1: " + info);
};

YAHOO.test.Class2 = function(info) {
    // chain the constructors
    YAHOO.test.Class2.superclass.constructor.call(this, info);
    alert("Class2: " + info);
};

// Class2 extends Class1.  Must be done immediately after the Class2 constructor
YAHOO.lang.extend(YAHOO.test.Class2, YAHOO.test.Class1);

YAHOO.test.Class2.prototype.testMethod = function(info) {
    // chain the method
    YAHOO.test.Class2.superclass.testMethod.call(this, info);
    alert("Class2: " + info);
};

var class2Instance = new YAHOO.test.Class2("constructor executed");
class2Instance.testMethod("testMethod invoked");

YAHOO.lang.augment

将某个对象的prototype属性复制到另一个对象,代码重用的好方法.

<div id="consoleelement"> div>

<script>
////////////////////////////////////////////////////////////////////////////
// The ConsoleProvider example will log to the console if available, or a
// div with id="consoleelement" if the console is not available
////////////////////////////////////////////////////////////////////////////
YAHOO.example.ConsoleProvider = function() { };
YAHOO.example.ConsoleProvider.prototype = {
    log: function(msg) {
        // use the error console if available (FF+FireBug or Safari)
        if (typeof console != "undefined") {
            console.log(msg);
        // write the msg to a well-known div element
        } else {
            var el = document.getElementById("consoleelement");
            if (el) {
                el.innerHTML += "

" + msg + "

";
            }
        }
    }
};

////////////////////////////////////////////////////////////////////////////
// Define a class that should be able to write debug messages
////////////////////////////////////////////////////////////////////////////
YAHOO.example.ClassWithLogging = function() { };
YAHOO.lang.augment(YAHOO.example.ClassWithLogging, YAHOO.example.ConsoleProvider);

////////////////////////////////////////////////////////////////////////////
// Try it out
////////////////////////////////////////////////////////////////////////////
var c = new YAHOO.example.ClassWithLogging();
c.log("worked");

script>

YAHOO.log

log工具,使用之前要先引入logger控件,如果没有引入,那么浏览器会忽略这条log语句.用这个东西使你免陷于开发时加alert,发布时四处删除alert的窘境.(注:当然,用firebug调试也可以避免alert问题.).

其他

至于YAHOO.env 和 YAHOO.name 等,参考官方文档即可.

http://developer.yahoo.com/yui/yahoo/

Chenyunshi 2008-10-09 17:25 发表评论

实战YUI 的 patinator(datatable) 组件

Chenyunshi — Mon, 06 Oct 2008 03:17:00 GMT

摘要: 讲述如何定制YUI的paginator组件阅读全文

Chenyunshi 2008-10-06 11:17 发表评论

实战YUI 的 Menu 组件

Chenyunshi — Wed, 01 Oct 2008 17:07:00 GMT

摘要: Menu家族成员 YAHOO.widget.Menu YAHOO.widget.Overlay 的子类,其他menu容器的超类. Menu类创建一个容器(Container)并放置一列垂直的列表.每项菜单称为MenuItem.YAHOO.widget.ContextMenuMenu的子类,创建一个菜单,能被某html元... 阅读全文

Chenyunshi 2008-10-02 01:07 发表评论

实战YUI的Layout Manager 组件

Chenyunshi — Wed, 01 Oct 2008 13:27:00 GMT

摘要: 序和官网示例吹得天花乱坠不同,使用YUI是特别让人讨厌的经历,按照官方网指导有时候并不能得到正确的结果.本文记录了一些心得,顺手把官网文章翻译下来,以作备忘.正文出现的是翻译文字,个人见解用蓝色或红色字体标出.YUI使用常识篇1.必须引入一些js库和css,并且顺序很重要.顺序不对很可能得不到正确结果.2.debug版本js格式整齐,带所有log,通常用于开发阶段.min版本js将debug版本... 阅读全文

Chenyunshi 2008-10-01 21:27 发表评论

IT博客-yunshichen-随笔分类-Yahoo YUI