橫幅廣告

顯示具有 YUI 標籤的文章。 顯示所有文章
顯示具有 YUI 標籤的文章。 顯示所有文章

2012年2月20日 星期一

YUI 得知Datatable完成的方法

If you want to know that when is the datatable done, you can subscript the "postRenderEvent" event.

Juts like:
myDataTable.subscribe( 'postRenderEvent', function()
{
  //Do something
});

You can see here in more detail.

YUI 手動取得Datatable資料內容

IF you want to get datatable by a manual way, you can use the following code:


myDataTable.getRecord(0).getData("id");

  • myDataTable is your datatable name.
  • The parameter in getRecord is row number. (0 ~ the numebr of row - 1)
  • The parameter in getData is a key name. You have to specifically assign that.

2011年11月7日 星期一

(2) YUI與jQuery

YUI與 jQuery 都是我個人相當喜愛的前端工具,而jQuery那句 The Write Less, Do More更是深得我心。

其實,早些年前,我也分不太清楚兩者的差異,總覺的兩個都是Cross-browser的framework,直到開始使用兩套framework進行網頁的前端開發,才漸漸對兩者有了更深一層的了解。

在YUI這方面,YUI給我的感覺比較像一套Total solution,為什麼?因為YUI除了提供相當多的Widget之外,另外也提供了相當多的Utility,例如CSS Tool、Event、Animation、Browser History Manager、Drag and Drop、AJAX、JSON及Selector等等。另外,YUI是在一個較統一的架構下進行開發,其程式撰寫風格、使用方式以及介面風格較為統一,並且程式範例、文件相當齊全,如此一來可能有助於使用者可以觸類旁通,在遇到問題時,也有相當完整的文件考供參考(缺點是目前大多都為英文)

而jQuery這邊,我個人相當喜歡它的簡潔,在使用上非常的方便(Easy)且有力(Powerful),只要買一相關的書籍,快速的翻閱一下,幾乎可以馬上感受到它的效用及易上手,也可能是jQuery實在太方便,促使YUI3的誕生(笑,這點我不敢肯定,不過YUI3的確簡化了不少使用的程序)。jQuery主要可分為兩個部份,一部份是Core,提供Selector、Animation、AJAX....等等,其中我個人覺的Selector、Animation在推出時更是打敗天下無敵手,當初都是使用Prototype Javascript的我,看到jquery真是痛哭流涕,省下來的時間都快可以為老闆多接一個CASE了(咦,為什麼不是提早下班?)。另外,jQuery UI也提供UI較有關的Utility及Widget,讓前端開發者也可以享受同一體系出來的Widget,不僅可與jQuery完美的搭配,其程式風格也相當簡潔,個人有時在小專案中也會使用jQuery UI的Widget,畢竟殺雞不一定非得用牛刀,這個輕盈的工具也是相當好用的。

相較YUI,jQuery目前所提供的Widget數目較少,部份jQuery UI未提供的Widget在網路上也找的到熱心人士所開發出來的Widget,但是缺點就是風格較不統一,以及未能保證其可靠性。因此,基於這幾點,使得我最後在前端開發上,大多採用YUI的Widget較多。

事實上應該這麼說,我在介面的呈現及Widget我採用相當多的YUI工具,但是在Selector、Animation、AJAX我個人則是傾向使用jQuery,主要理由可能跟習慣及方便性有關,而換句話或許也可以說同時使用兩套Framework來互相截長補短,以提升開發速度,讓自己可以不必一直埋首與程式碼奮鬥。

(1) 初次見面 - Yahoo User Interface (YUI)

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

YUI是由Yahoo所開發而成的一套Framework,其中使用到的技術包括Javascript、FLASH、AJAX,而資料傳遞格式最常件的是使用JSON。YUI採BSD授權方式(BSD Licence),其中最大的好處就是可以自由的修改,並用運在商業上面,也因此,我個人較傾向使用YUI 。

另外有一套大家耳熟能詳的Framework - ExtJs也是以YUI為基礎發展出來的,無論在畫面、功能上都相當優秀,但是相較於YUI,ExtJs使用在商業上是須要付費的(個人、教育不用付費)。

YUI目前分為兩個版本,分別是YUI2與YUI3。
  • YUI2:
    • 2006年投入研發。
    • Widget相當完整:AutoComplete, Button, Calendar, Carousel, Charts, Color Picker, Container (including Module, Overlay, Panel, Tooltip, Dialog, SimpleDialog), DataTable, ImageCropper, Layout Manager, Menu, Paginator, Progress Bar, Rich Text Editor, Slider TabView, TreeView, Uploader。
  • YUI3:
    • 2009年投入研發。
    • 以快速、有用、安全為目標。
    • 比起YUI2,在使用上較為簡潔。
    • Widget發展中:AutoComplete, Calendar, Charts, DataTable, Dial, MenuNav Node Plugin, Overlay, Panel, ScrollView, Slider, TabView。