ExtJS 3.0 在skpet里面的代碼提示 (含破解jar)

原文地址:http://atian25.javaeye.com/blog/426824

官方的extjs3.0包里面沒(méi)有提供ext.jsb文件.

于是去官方論壇問(wèn)了下, 3.0他們提供的是jsb2,基于json的.

現(xiàn)在spket還不支持。

有人重新做了個(gè)臨時(shí)的3.0的jsb文件,如附件。

用法:

1.下載后放到3.0的src目錄下 (一定要切記...我就是一時(shí)糊涂放錯(cuò)了...在官方那鬧了笑話 -.-!!)

2.然后在skpet中如下圖設(shè)置:

3.設(shè)置為默認(rèn)profile

4.設(shè)置完后,關(guān)閉所有標(biāo)簽頁(yè) ,重啟skpet就ok了.

5.提示效果如下圖:

關(guān)于spket和extjs的ide,請(qǐng)參考:http://www.javaeye.com/topic/161161

09.07.23更新:

skpet出新版本了,支持extjs的jsb2.官方下載:

Spket IDE 1.6.17 released - 22 July 2009

http://spket.com/

09.08.11更新

spket1.6.16的破解包,覆蓋即可.

下載地址見(jiàn)http://atian25.javaeye.com/blog/426824文末

09.08.12更新:

ext.jsb2已經(jīng)包含在官方的壓縮包里面了.

或者你可以從我另一篇blog中下載:http://atian25.javaeye.com/admin/blogs/445480

注意:

1.該jsb2文件需要spket1.6.17

2.放置目錄為根目錄而不是src目錄 (跟前面的jsb文件不同)

- by tz

posted @ 2009-08-13 21:50 天豬閱讀(2826) | 評(píng)論 (2) | 編輯收藏

ExtJS 2.3/3.0 定制你所需要的模塊

原文地址:http://atian25.javaeye.com/blog/445480
天豬部落閣 - 專(zhuān)注于(ExtJS && AS3 && Java)
附件地址見(jiàn)原文地址文末

很實(shí)在的一個(gè)需求,就是我們只需要extjs的一部分功能,不想把整個(gè)類(lèi)庫(kù)都包含進(jìn)來(lái).

所以讓我們來(lái)定制extjs吧~

1. ExtJS 1.1.1或2.3.0

可以用官方的在線工具來(lái)定制:http://extjs.com/products/extjs/build/

使用教程:

e文:http://extjs.com/learn/Tutorial:Building_Ext_From_Source

中文:http://extjs.org.cn/node/364

2. EXTJS 3.0

現(xiàn)在還沒(méi)有在線版,可以通過(guò)以下方法來(lái)自己定制:

1. 下載Ext 3.0.0 SDK. http://extjs.com/products/extjs/download.php?dl=extjs3
2. 下載JSBuilder2. http://extjs.com/products/jsbuilder/ (或者看文末的附件)
3. 下載Ext 3.0.0的ext.jsb2文件 http://extjs.com/forum/showthread.php?p=354473 (或者看文末的附件)

4. 把JSBuilder2解壓jar到extjs根目錄下,ext.jsb2也放到根目錄下

5. 用你的文本編輯器編輯ext.jsb2文件,僅保留你需要的模塊

6. jsb2文件中的deployDir: 'ext-3.0.0-build'表示相對(duì)輸出目錄

7. cmd,切換到ext根目錄下,執(zhí)行:

G:\Learning\Web\Javascript\ExtJS\ext-3.0.0> java -jar "JSBuilder2.jar" -p ./ext.jsb2 -d ./

8.等待刷屏完畢后去你在jsb2中指定的目錄下找輸出吧.

3.試驗(yàn)

一個(gè)試驗(yàn)的例子,僅包含Tree組件,如附件

1) resource部分未作過(guò)濾

2) 注意依賴(lài)關(guān)系,如

        name: 'Trees',
        file: 'pkgs/pkg-tree.js',
        isDebug: true,
        pkgs: ['pkgs/cmp-foundation.js']

3)輸出的文件樹(shù)如下:

posted @ 2009-08-13 21:48 天豬閱讀(2398) | 評(píng)論 (1) | 編輯收藏

ExtJS 3.0 Designer Preview (官方的IDE可視化工具)

原文地址: http://atian25.javaeye.com/blog/444581

官方大爆料... http://extjs.com/blog/2009/08/10/ext-js-30-be-outstanding/

Ext JS 3.0.0 Patch Release --- 要收費(fèi)...等流放吧 ^_^
Ext JS Public Commit Log
JS Builder 2
CSS Refactor & Improvements
Memory Management Improvements

Designer Preview

Constructing your interfaces in code will be a thing of the past. We are releasing a Designer Preview that will allow you to experiment with the designer interface and to explore how configs affect your layout. Soon, you will be able to build your application components using base Ext components and Certified User Extensions.

Code generation is currently not available. Our intentions are to charge a fee for this service and to enable our community to create and sell their creations on our marketplace. Our goals are lofty. We want to be the iTunes of Web App Development.

附件中有下載.

預(yù)覽版還不提供代碼生成功能.出了也是會(huì)收費(fèi)的...

不過(guò)嘛...群眾的智慧...

另,安裝該AIR應(yīng)用后,可以自己去看下\Ext Designer Preview\deploy\designer-complete.js的源碼.

用http://jsbeautifier.org/ 來(lái)格式化

附件中也有格式化后的代碼,9k行.

下載地址見(jiàn)http://atian25.javaeye.com/blog/444581文末

posted @ 2009-08-13 21:46 天豬閱讀(6751) | 評(píng)論 (3) | 編輯收藏

[翻譯]ExtJS ChangeLog 2.2 -> 3.0.0 -- by tz

http://atian25.javaeye.com/blog/426310

郁悶...本來(lái)都寫(xiě)完的了...結(jié)果插入一個(gè)表格...JE編輯器就出問(wèn)題了...內(nèi)容不見(jiàn)了一半...格式也全亂了...得重來(lái)...

翻譯的不好,請(qǐng)多見(jiàn)諒。其中有些地方覺(jué)得太拗口了,就直接給出原文了,如果你有更好的翻譯,請(qǐng)跟帖,謝謝。

原文地址: http://extjs.com/forum/showthread.php?t=70352

Changes, Additions (roughly organized alphabetically)

1.Ext

新增:
- iterate 方法 - 遍歷一個(gè)數(shù)組或?qū)ο?對(duì)每個(gè)元素都執(zhí)行指定的函數(shù)
- isNumber 方法 - 判斷傳遞的參數(shù)對(duì)象是否是數(shù)字
- isString 方法 - 判斷傳遞的參數(shù)對(duì)象是否是字符串
- isBoolean 方法 - 判斷傳遞的參數(shù)對(duì)象是否是布爾值
- isDefined 方法 - 判斷傳遞的參數(shù)對(duì)象是否已經(jīng)定義

2.Ext.lib.Ajax

變更: Ajax responses. The core adapter file in the Ext.lib.Ajax class has been changed in line with the W3 XMLHttpRequest specification. The response object which emulates the XHR now has getResponseHeader and getAllResponseHeaders as f unctions rather than Arrays to keep inline with the real XHR object. So, anyone who was currenltly examining headers using an Array (as inherited from YUI via yui-ext) will need to change to use a function.

3.Ext.Componet

新增:
- A Component's Observable events may now be set to bubble up the Component-ownerCt axis.

4.Ext.BoxComponent

新增:
- getWidth()
- getHeight()
- getOuterSize()

5.Ext.Button

新增:
- Rather than being limited to only positioning buttons in a buttons configuration, they can now be placed anywhere you please. 你的按鈕現(xiàn)在可以放在任意地方,而不僅限于buttons配置項(xiàng)
- Button現(xiàn)在可以縮放為任意高寬,并且有高級(jí)的文字布局。 (Buttons can now scale to any height or width and have advanced text positioning.)
- 新的配置:scale: 'small' , iconAlign : 'left' , arrowAlign : 'right'
變更:
- Button現(xiàn)在是一個(gè)有效的BoxComponent,可以被布局管理器管理。 (Button is now a valid BoxComponent and can partake in layout management. )
- Button的實(shí)現(xiàn)已經(jīng)完全重寫(xiě),所以舊版本時(shí)候?qū)懙淖远x樣式/主題需要相應(yīng)的修改。(The markup for buttons is completely different and will require changes if you had implemented a custom theme. )

6.Ext.Component

新增:
- afterrender事件
- ref 配置項(xiàng) - establish a named reference for an object an ancestor Container (mitigate dependency on 'id' and Ext.getCmp).
- ptypes - ComponentMgr manages plugins similar to xtypes (use Ext.preg similar to Ext.reg)
- nextSibling
- previousSibling
- getDomPositionEl

7.Ext.ComponentMgr

新增:
- isRegistered 方法 - 檢查一個(gè)xtype是否已經(jīng)被注冊(cè)

8.Ext.Container

新增:
- get()

9.Ext.data.Reader

已過(guò)時(shí):
- 推薦使用id, 請(qǐng)用 propertyId 和 idIndex

10.Ext.data.Store

新增:
- store xtypes
- autoDestroy 配置項(xiàng) - 當(dāng)store綁定的component被銷(xiāo)毀的時(shí)候,銷(xiāo)毀該Store
- setBaseParam()
變更:
- baseParams可以被load方法傳遞的同名參數(shù)所覆蓋。( baseParams may be overwritten by params of same name passed to load() )
已過(guò)時(shí):
- 不推薦使用 id ,請(qǐng)用 storeId 代替它
- 不推薦使用 loadexception 事件,請(qǐng)用 exception 事件
- SimpleStore 更名為 ArrayStore

11.Ext.Element

新增:
- mouseenter事件
- mouseleave事件
變更/已過(guò)時(shí):
- getAttributeNS() - 已過(guò)時(shí),用getAttribute()代替
- autoHeight() - 移除
- alignTo() - 變更參數(shù)"position"
- query() - 新增參數(shù)"unique"
- focus() - 新增參數(shù)"defer"

12.Ext.EventManager

變更:
- within() - can now also check if the passed element is the target or related target

13.Ext.form

新增:
- 當(dāng)動(dòng)態(tài)添加Container到FormPanel時(shí),Fields會(huì)被添加到BasicForm's的集合中。所以BasicForm's setValues 方法現(xiàn)在可以始終對(duì)動(dòng)態(tài)添加的Fields有效。(When dynamically adding Containers anywhere in a FormPanel, any Fields are now found and added to the BasicForm's Collection. So BasicForm's setValues method will now work consistently with dynamically added Fields.)
變更:
- Ext.form.Radio/Checkbox - 樣式/主題已經(jīng)被改變,詳見(jiàn)http://www.extjs.com/forum/showthread.php?p=312770#post312770.
- Ext.form.TextField - allowBlank的驗(yàn)證行為已經(jīng)被改變,請(qǐng)參見(jiàn)文檔
- Ext.form.FormPanel - buttonAlign does not override the default center for Ext.Panel ('right')

14.Ext.grid.GridPanel

新增:
- columnLines 配置項(xiàng) (boolean) - adds class ' x-grid-with-col-lines'
- Ext.grid.Column
  - 用來(lái)作為columns參數(shù)傳遞給ColumnModel (Instances of this class are used as columns passed to ColumnModel)
  - xtypes可以用來(lái)指定一些預(yù)先配置好的renderer(xtypes can be used to specify a preconfigured renderer)
  - renderer may be specified in additional ways
- Grid RowEditor Class
- Grid like ListView and ListView.Sorter Classes (譯注:就是一個(gè)用DataView+XTemplate來(lái)模擬的Grid,輕量)
- Grid BufferedView Class. Buffered GridView enhances performance by waiting to render rows until they are visible.(譯注:對(duì)大數(shù)據(jù)量的Grid有明顯的性能提升,實(shí)際上就是只渲染用戶可見(jiàn)的列,拖動(dòng)的時(shí)候再渲染其他.官方還有其他的一個(gè)擴(kuò)展 Ext.ux.LiveGrid,詳見(jiàn):http://extjs.com/forum/showthread.php?t=17791)

15.Layouts:

新增:
- hbox布局和vbox布局
  - 譯注:很有用的兩個(gè)布局。但區(qū)域見(jiàn)不能split,不過(guò)官方論壇有擴(kuò)展。詳見(jiàn)官方示例
  - http://extjs.com/deploy/dev/examples/layout-browser/layout-browser.html
  - http://extjs.com/deploy/dev/examples/layout/hbox.html
  - http://extjs.com/deploy/dev/examples/layout/vbox.html
- ToolbarLayout and MenuLayout (internally used by respective classes)
- Layout managers now defer layout of hidden or collapsed child Components until such time as the child Component becomes visible or expanded. This avoids size calculation problems in hidden/collapsed Containers, and removes the need to use hideMode: 'offsets' (may even require that it be removed).

16.Ext.Menu

新增:
- Menu Overflow. Whenever a menu gets so long that the items won’t fit the viewable area, it provides the user with an easy UI to scroll the menu. This feature is turned on by default and can be disabled by the configuration option enableScrolling.(譯注:簡(jiǎn)單的說(shuō)就是Menu溢出后的滾動(dòng)效果,默認(rèn)是開(kāi)啟該效果,可以通過(guò)enableScrolling來(lái)配置,詳見(jiàn)官方示例)
變更/已過(guò)時(shí):
- Toolbar and Menu are now proper Containers (formerly extended from BoxComponent). 現(xiàn)在Toolbar和Menu都繼承Container
- Breaking change: MenuItem的ids現(xiàn)在已經(jīng)不是局部變量了,所以你不能在多個(gè)menu里面用一個(gè)id.建議:用唯一的id或者用itemIds來(lái)替代它。(MenuItem ids are no longer local to their menu but global component ids. This means that you can't use the same id in multiple menus. Suggested fix: Use unique ids or switch to using itemIds.)
- As well as Menu being a Container, this also means Menu can be a regular Component. Menu did not extend BoxComponent before, but was out on its own. Now, it can behave either as a regular floating Menu, or, if configured floating: false, it can be used as a usual inline Component of a Container.(譯注:簡(jiǎn)單的說(shuō)就是由于menu的繼承改變,現(xiàn)在你可以設(shè)置Menu為浮動(dòng)的,或者像平常的組件那樣使用它)
- DateItem和ColorItem已經(jīng)被移出,因?yàn)闆](méi)有必要了,現(xiàn)在你可以把任意組件放入menu的items中
- autoWidth() - 變更為autoSize()

17.Ext.MenuButton - 該類(lèi)已經(jīng)被移除,用SplitButton代替它

18.Ext.StatusBar - 該類(lèi)已經(jīng)被移出core庫(kù),在3.0final版會(huì)有個(gè)Ext.ux.StatusBar

19.Ext.Toolbar

新增:
- Toolbar Overflow. A menu for items that don’t fit the visible toolbar area will be created by default and can be disabled with the configuration option enableOverflow. Items in the menu react with the same handlers as the toolbar items.(譯注:簡(jiǎn)單的說(shuō)就是Toolbar溢出后的滾動(dòng)效果詳見(jiàn)官方示例)
變更:
- Toolbar and Menu are now proper Containers (formerly extended from BoxComponent).現(xiàn)在Toolbar和Menu都繼承Container

20.Ext.Tooltip

新增:
- delegate option added so one Tooltip can handle multiple child elements of its target based on selection using the delegate config.(譯注:新增的這個(gè)屬性很有用,就是通過(guò)設(shè)置的selector對(duì)某個(gè)元素的子對(duì)象設(shè)置Tip,在2.0的時(shí)候我們經(jīng)常需要的Gird RowTip,CellTip都可以實(shí)現(xiàn)了,不需要實(shí)例化很多Tip對(duì)象)
- AnchorTips - Tooltips now support an anchor configuration which will allow you to bring attention to a particular element or component with a small callout arrow.(譯注:簡(jiǎn)單的說(shuō)就是箭頭Tip,詳見(jiàn):http://extjs.com/deploy/dev/examples/simple-widgets/qtips.html)

21.Ext.util.Format

新增/變更:
- ellipsis() - "word" parameter added
- focus() - "defer" parameter added
- number() - added
- numberRenderer() - added
- plural() - added

22.Ext.util.Observable

新增:
- Ext.util.Observable.observeClass() - Class level observability 類(lèi)級(jí)別的觀察/通知

23.ux's that worked prior to 3.x may need some tweaking (especially if the ux used private properties). ux's should be checked they are utilizing the latest preferred techniques and properties. More notes here. 舊的擴(kuò)展需要相應(yīng)的進(jìn)行修改,詳見(jiàn):http://extjs.com/forum/showthread.php?p=338913#post338913

24.CSS. general updates, as well as refactoring to split css into visual and structural files to simplify theming.

25.新增:圖表Charting (Chart, PieChart, CartesianChart, LineChart, BarChart - numeric, time, category axis) -- (譯注:其實(shí)就是YUI Chart,可以看:http://developer.yahoo.com/yui/charts/ , 或者可以看下我的blog:ExtJS 3.0 Chart 小用一下 http://atian25.javaeye.com/blog/413947)

26.新增:Ext.FlashComponent (譯注:似乎是用了swfobject,管理swf方便多了,不用adobe那又長(zhǎng)又臭的代碼)

27.新增:Direct (Direct, Ext.data.DirectStore, Ext.data.DirectProxy) - 官方3.0極力推出的東西,詳見(jiàn):http://extjs.com/blog/2009/05/13/introducing-ext-direct/

28.新增:Writer

29.新增:Ext.Spacer - xtype 'spacer' (for empty box component)

30.新增:ButtonGroup (xtype: 'buttongroup') (譯注:按鈕組,仿office2007風(fēng)格,詳見(jiàn):http://extjs.com/deploy/dev/examples/button/buttons.html)

31.新增:GroupTabs - (譯注:詳見(jiàn)http://extjs.com/deploy/dev/examples/grouptabs/grouptabs.html)

32.增強(qiáng):Debug Console (譯注:還是firebug好用,不過(guò)它可以看到store等,詳見(jiàn):http://extjs.com/deploy/dev/examples/debug/debug-console.html)

33.新增:Ext.Error

Changes to some example classes: 示例類(lèi)的修改

(不敢用javaeye編輯器的表格了..自己將就著看吧...)

Class x(p)type Deprecates

Ext.ux.data.PagingMemoryProxy Ext.data.PagingMemoryProxy

Ext.ux.form.FileUploadField fileuploadfield Ext.ux.FileUploadField

Ext.ux.form.SelectBox selectbox Ext.ux.SelectBox

Ext.ux.form.SpinnerField spinnerfield Ext.form.SpinnerField (remove xtype=spinner)

Ext.ux.form.ItemSelector itemselector Ext.ux.ItemSelector

Ext.ux.form.MultiSelect multiselect Ext.ux.Multiselect

Ext.ux.grid.CheckColumn checkcolumn (p)

Ext.ux.grid.GroupSummary Ext.grid.GroupSummary

Ext.ux.grid.HybridSummary Ext.grid.HybridSummary

Ext.ux.grid.RowEditor roweditor (p)

Ext.ux.grid.RowExpander rowexpander (p) Ext.grid.RowExpander

Ext.ux.grid.TableGrid Ext.grid.TableGrid

Ext.ux.GMapPanel gmappanel

Ext.ux.SliderTip

Ext.ux.SlidingPager

Ext.ux.Spinner

Ext.ux.Spotlight Ext.Spotlight

Ext.ux.Statusbar Ext.Statusbar

Ext.ux.TabCloseMenu tabclosemenu (p)

Ext.ux.tree.ColumnTree columntree Ext.tree.ColumnTree

Ext.ux.tree.ColumnNodeUI Ext.tree.ColumnNodeUI

Ext.ux.tree.XmlTreeLoader Ext.ux.XmlTreeLoader

Changes to Resources 資源的變更

Ensure you have updated all the Ext-provided CSS with the new CSS from version 3.
Ensure you have updated all the Ext-provided images with the new images from version 3.

Additional References 其他參考

http://extjs.com/blog/2009/06/03/ext-js-30-rc2-release-stable-robust-and-enhanced/
http://extjs.com/blog/2009/05/13/introducing-ext-direct/
http://extjs.com/blog/2009/05/04/ext-js-30-rc11-released/
http://extjs.com/blog/2009/04/04/ext-core-30-beta-released/

posted @ 2009-07-15 13:26 天豬閱讀(2886) | 評(píng)論 (0) | 編輯收藏

[原創(chuàng)]ExtJS Grid 自定義排序規(guī)則

有一些需求如:

1.一個(gè)文件管理的Grid,要求排序的時(shí)候,文件夾永遠(yuǎn)在頂部

2.一個(gè)顯示成功率的Grid,要求成功數(shù)+失敗數(shù)=0的數(shù)據(jù),不參與排序,永遠(yuǎn)在底部

ExtJs本身并沒(méi)有暴露這個(gè)接口,所以我們只能自己重寫(xiě),如下代碼:

1 var store = new Ext.data.JsonStore({
2   root:'data',
3   fields:[
4     'name',
5     {name:'sucCount',type:'int'},
6     {name:'failCount',type:'int'},
7     {name:'sucRate',type:'float'},
8     {name:'isValidateTest',type:'boolean'},
9     {name:'statType',type:'int'},
10     'testLogIds','bsc','msc','sgsn'
11   ],
12   sortInfo:{field: 'sucRate', direction: 'ASC'},
13   //排序規(guī)則
14   sortData:function(f, direction){
15     direction = direction || 'ASC';
16     var dir = direction == 'ASC' ? 1 : -1;
17     var st = this.fields.get(f).sortType;
18     //關(guān)鍵地方,重寫(xiě)排序排序規(guī)則
19     var fn = function(r1, r2){
20       if(!r1.get('isValidateTest')||!r2.get('isValidateTest')){
21         //無(wú)效數(shù)據(jù)永遠(yuǎn)在下面
22         return !r1.get('isValidateTest') ? dir : -dir;
23       }else{
24         var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
25         return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
26       }
27     };
28     this.data.sort(direction, fn);
29     if(this.snapshot && this.snapshot != this.data){
30       this.snapshot.sort(direction, fn);
31     }
32   }
33 });

posted @ 2009-07-01 10:20 天豬閱讀(3056) | 評(píng)論 (0) | 編輯收藏

[原創(chuàng)]ExtJS Grid tooltip的幾種實(shí)現(xiàn)方式

http://atian25.javaeye.com/blog/417361

1.表頭提示

在2.2里面是設(shè)置ColumnModel.tooltip ,3.0則是Column. tooltip 如下:

1 var grid = new Ext.grid.GridPanel({
2   columns:[
3     {header:'名稱(chēng)',dataIndex:'name',tooltip:'對(duì)象名稱(chēng)'},
4     {header:'開(kāi)始時(shí)間 - 結(jié)束時(shí)間 <br/>成功/失敗/成功率', dataIndex:'sucRate',tooltip:'成功/失敗/成功率'}
5   ]
6 });

2.單元格提示

1)使用Ext.QuickTips

在開(kāi)始的時(shí)候就執(zhí)行Ext.QuickTips.init();

然后對(duì)需要提示的單元格,重寫(xiě)renderer函數(shù),添加ext:qtitle , ext:qtip這2個(gè)屬性即可。

這個(gè)在官方的FAQ上有詳細(xì)描述: http://extjs.com/learn/Ext_FAQ_Grid#Add_ToolTip_or_Qtip

代碼:

1 //option 1
2 //========
3 renderer = function (data, metadata, record, rowIndex, columnIndex, store) {
4     //build the qtip:
5     var title = 'Details for ' + value + '-' + record.get('month') +
6         '-' + record.get('year');
7     var tip = record.get('sunday_events');
8
9     metadata.attr = 'ext:qtitle="' + title + '"' + ' ext:qtip="' + tip + '"';
10
11     //return the display text:
12     var displayText = '<span style="color: #000;">' + value + '</span><br />' +
13         record.get('sunday_events_short');
14     return displayText;
15 };
16
17 //option 2
18 //========
19 renderer = function (data, metadata, record, rowIndex, columnIndex, store) {
20     var qtip = '>';
21     if(data >= 0){
22         qtip = " qtip='yeah'/>";
23         return '<span style="color:green;"' + qtip + data + '%</span>';
24     }else if(data < 0){
25         qtip = " qtip='woops'/>";
26         return '<span style="color:red;"' + qtip + data + '%</span>';
27     }
28     return data;
29 };
30
31 //option 3
32 //========
33 var qtipTpl = new Ext.XTemplate(
34     '<h3>Phones:</h3>',
35     '<tpl for=".">',
36     '<div><i>{phoneType}:</i> {phoneNumber}</div>',
37     '</tpl>'
38 );
39
40 renderer = function (data, metadata, record, rowIndex, columnIndex, store) {
41
42     // get data
43     var data = record.data;
44
45     // convert phones to array (only once)
46     data.phones = Ext.isArray(data.phones) ?
47         data.phones :
48         this.getPhones(data.phones);
49
50     // create tooltip
51     var qtip = qtipTpl.apply(data.phones);
52
53     metadata.attr = 'ext:qtitle="' + title + '"' + ' ext:qtip="' + tip + '"';
54
55     //return the display text:
56     return data;
57 };

2)使用ToolTip

官方也已經(jīng)給出方法:

http://extjs.com/forum/showthread.php?p=112125#post112125

http://extjs.com/forum/showthread.php?t=55690

以上給出的方法是可以讓一個(gè)grid里面的元素共享一個(gè)tooltip對(duì)象。一般用來(lái)做rowtip

不過(guò)3.0有更好的方式,如下:

3.行提示 RowTip

ExtJS3.0新增的方法,設(shè)置tooltip的delegate

代碼:

1 var myGrid = new Ext.grid.gridPanel(gridConfig);
2 myGrid.on('render', function(grid) {
3     var store = grid.getStore();  // Capture the Store.
4
5     var view = grid.getView();    // Capture the GridView.
6
7     myGrid.tip = new Ext.ToolTip({
8         target: view.mainBody,    // The overall target element.
9
10         delegate: '.x-grid3-row', // Each grid row causes its own seperate show and hide.
11
12         trackMouse: true,         // Moving within the row should not hide the tip.
13
14         renderTo: document.body,  // Render immediately so that tip.body can be referenced prior to the first show.
15
16         listeners: {              // Change content dynamically depending on which element triggered the show.
17
18             beforeshow: function updateTipBody(tip) {
19                 var rowIndex = view.findRowIndex(tip.triggerElement);
20                 tip.body.dom.innerHTML = "Over Record ID " + store.getAt(rowIndex).id;
21             }
22         }
23     });
24 });

4.其他方法

監(jiān)聽(tīng)GridView或Store的事件,然后通過(guò)rowSelector或getRow方法來(lái)遍歷,自己加tooltip... 這個(gè)方式請(qǐng)無(wú)視吧

posted @ 2009-07-01 10:14 天豬閱讀(2504) | 評(píng)論 (0) | 編輯收藏

IE7/FF3可用的獲取異常發(fā)生所在的行數(shù)

Error具有下面一些主要屬性：

* description: 錯(cuò)誤描述 (僅IE可用).
* fileName: 出錯(cuò)的文件名 (僅Mozilla可用).
* lineNumber: 出錯(cuò)的行數(shù) (僅Mozilla可用).
* message: 錯(cuò)誤信息 (在IE下同description)
* name: 錯(cuò)誤類(lèi)型.
* number: 錯(cuò)誤代碼 (僅IE可用).
* stack: 像Java中的Stack Trace一樣的錯(cuò)誤堆棧信息 (僅Mozilla可用).

在IE里面沒(méi)有l(wèi)ineNumber. 但可用下面的方法找出:

http://forum.byr.edu.cn/wForum/disparticle.php?boardName=SoftDesign&ID=29948&pos=6&page=1

1 <script type="text/javascript">
2 window.onerror=testError;
3 function testError(){
4  arglen=arguments.length;
5  var errorMsg="參數(shù)個(gè)數(shù)："+arglen+"個(gè)";
6  for(var i=0;i<arglen;i++){
7   errorMsg+="\n參數(shù)"+(i+1)+"："+arguments[i];
8  }
9  alert(errorMsg);
10  window.onerror=null;
11  return true;
12 }
13
14 function test(){
15 error
16 }
17 test()
18 </script>

posted @ 2008-09-26 14:26 天豬閱讀(428) | 評(píng)論 (0) | 編輯收藏

理清幾個(gè)RIA的概念及技術(shù)的選擇 (AIR,WPF,JAVA,FLEX,SLIVERLIGHT)

轉(zhuǎn)帖自:http://blog.csdn.net/david_lv/archive/2008/03/05/2149377.aspx

昨天去參加adobe AIR發(fā)布會(huì)

首先申明：我不是adobe雇傭的槍手，我也從不認(rèn)識(shí)adobe的人。我只是一名被C/S和B/S長(zhǎng)期困擾希望尋找一套解決方案的人。

昨天去參加了adobe AIR 發(fā)布會(huì)

adobe是業(yè)界著名的客戶端展現(xiàn)工具和展現(xiàn)設(shè)計(jì)工具提供商。

展現(xiàn)工具：PDF、FLASH。展現(xiàn)設(shè)計(jì)工具：photoshop、Dreamwaver、FLASH。

很多人都疑問(wèn)AIR有什么用。昨天在會(huì)場(chǎng)也有同學(xué)提出了這個(gè)問(wèn)題。既然有了AJAX 純的JS的客戶端表現(xiàn)組件包，如最近剛獲得金牛獎(jiǎng)的ZK組件包，那為何要有AIR？

我給大家解釋解釋。大家都能看到現(xiàn)在的趨勢(shì)：互聯(lián)網(wǎng)軟件在向客戶端融合，客戶端在向互聯(lián)網(wǎng)融合。

互聯(lián)網(wǎng)企業(yè)發(fā)源于WEB世界，那么它要延伸互聯(lián)網(wǎng)，必須要基于現(xiàn)在自己的優(yōu)勢(shì)和根。JS技術(shù)，這種根植于網(wǎng)絡(luò)世界的技術(shù)就是最理想的選擇。使用慣了WEB應(yīng)用軟件的用戶，對(duì)于本地安裝一個(gè)軟件，本地軟件那樣的操作習(xí)慣就感到很奇怪。

而對(duì)于習(xí)慣了使用本地軟件的用戶，現(xiàn)在開(kāi)始有了互聯(lián)網(wǎng)跨出局域網(wǎng)的業(yè)務(wù)需求了，怎么辦？一種辦法當(dāng)然是給他們另外開(kāi)發(fā)一套B/S企業(yè)管理軟件，但他們?cè)趺词褂枚疾豁樖帧?/font>

于是AIR產(chǎn)生。讓他們能滿足互聯(lián)網(wǎng)處理，又能像本地軟件一樣操作。

又有客官問(wèn)了，聽(tīng)過(guò)微軟也推出了一種客戶端跨互聯(lián)網(wǎng)處理的技術(shù)，叫WPF和WCF。微軟是客戶端的霸主，而且微軟的開(kāi)發(fā)工具也是一流的，adobe既不熟悉開(kāi)發(fā)工具這行當(dāng)，也沒(méi)有客戶端優(yōu)勢(shì)，微軟在OS層面做點(diǎn)手腳，就像當(dāng)年給netscape下點(diǎn)藥做點(diǎn)限制一樣，AIR就沒(méi)前途了。

但是，但是。這個(gè)世界總有但是。

要知道，做企業(yè)管理軟件應(yīng)用，很重要的就是數(shù)據(jù)安全。要把自己的數(shù)據(jù)和業(yè)務(wù)處理放到公網(wǎng)上，就有擔(dān)憂。但是企業(yè)發(fā)展必須跨互聯(lián)網(wǎng)，有需求啊。那怎么辦？用微軟的？太不安全了。于是挑選了JAVA。但JAVA一直雄霸于服務(wù)器端，客戶端JAVA也沒(méi)有經(jīng)驗(yàn)啊。從早期的 Applet，到Swing，都以失敗告終。不能讓JAVA的服務(wù)器端配合WPF的客戶端吧？于是AIR出場(chǎng)了。

adobe也很聰明，知道微軟這個(gè)長(zhǎng)年想擴(kuò)展到互聯(lián)網(wǎng)卻屢屢受挫的困獸，必然拼了老命也要推自己的WPF和WCF技術(shù)，這是微軟未來(lái)的命啊。想在這個(gè)霸主的肩膀上吃肉，是比登天難。于是祭出微軟最害怕的一招：開(kāi)源、免費(fèi)、基于開(kāi)放技術(shù)標(biāo)準(zhǔn)、跨平臺(tái)。

adobe不擅長(zhǎng)開(kāi)發(fā)工具的開(kāi)發(fā)，那就不開(kāi)發(fā)。況且這個(gè)世界上除了微軟世界的visual studio工具外，微軟的對(duì)立陣營(yíng)就有最開(kāi)放的eclipse。eclipse已經(jīng)不僅僅是一個(gè)JAVA的開(kāi)發(fā)IDE，現(xiàn)在Ruby、PHP、C++、 Python都在它上面有插件。于是adobe也把自己插在上面。跟著程序員大潮走，讓程序員使用自己最熟悉的IDE開(kāi)發(fā)AIR。

adobe一直擅長(zhǎng)客戶端表現(xiàn)，所以adobe也沒(méi)有必要提供一個(gè)從服務(wù)器到客戶端一整套技術(shù)方案。說(shuō)白了，AIR 就是一個(gè)和AJAX組件包一個(gè)層次的解決方案。主要用于客戶端表現(xiàn)。這點(diǎn)非常重要。許多同學(xué)沒(méi)有看清這一點(diǎn)，和DELPHI比，和JAVA比，和.net 比。其實(shí)AIR就專(zhuān)注客戶端表現(xiàn)。你的業(yè)務(wù)層完全可以用PHP、JAVA、C#來(lái)寫(xiě)。再說(shuō)了，AIR技術(shù)，內(nèi)在其實(shí)就是HTML+JAVAScript，只不過(guò)改進(jìn)了一些，換了個(gè)名字，叫MXML和ActionScript。微軟的WPF技術(shù)，也是這兩個(gè)技術(shù)組成。大家都是一路子。

PDF抓住了PC時(shí)代，F(xiàn)LASH抓住了瀏覽器時(shí)代，AIR是要抓住瀏覽器和PC融合的時(shí)代。這也是adobe的命根，所以?xún)杉夜径计戳嗣?。微軟有其?qiáng)大的現(xiàn)實(shí)客戶和研究開(kāi)發(fā)中心和營(yíng)銷(xiāo)手段，adobe則采用了最開(kāi)放最聯(lián)盟來(lái)對(duì)抗，讓微軟一家公司之力來(lái)對(duì)抗全球開(kāi)放的程序員。

WPF僅限于微軟平臺(tái)，雖然sliverlight號(hào)稱(chēng)以后也要垮MAC和LINUX平臺(tái)。但我說(shuō)的比較是AIR和WPF，而非FLEX和Sliverlight這兩種技術(shù)。

我對(duì)FLEX和Sliverlight這兩種技術(shù)一直心存懷疑。他們到底是給什么用戶用的呢？習(xí)慣于瀏覽器的用戶？人家有AJAX組件包啊，優(yōu)秀開(kāi)源的N多，商業(yè)的也N多。習(xí)慣于本地運(yùn)行軟件的用戶？人家有AIR和WPF這兩種技術(shù)啊。

FLEX和Sliverlight這兩種技術(shù)產(chǎn)生，我來(lái)解釋一下我自己的觀點(diǎn)。

adobe的AIR還沒(méi)有煉成。FLASH是adobe現(xiàn)在的優(yōu)勢(shì)。要想走到目的地，F(xiàn)LASH必須是自己的跳板，于是FLEX必須作為過(guò)渡。

而微軟呢？VISTA本來(lái)就是微軟最寄予希望的操作系統(tǒng)，原生的.net framework 3.0，而且全部用.net重寫(xiě)，一流的面向service的操作系統(tǒng)，圓了當(dāng)年微軟COM之夢(mèng)。而且.net framework 3.0最主要的技術(shù)WPF、WCF，還有一個(gè)夫死胎中的WF，其實(shí)都是很有未來(lái)前瞻的技術(shù)，但由于技術(shù)難度太大，當(dāng)然也由于太多人看透了微軟在互聯(lián)網(wǎng)戰(zhàn)略的陌生和遲疑和舊有EXE技術(shù)思想，所以都跑到了純正的互聯(lián)網(wǎng)公司，給VISTA形成了難產(chǎn)。微軟希望能無(wú)縫且毫無(wú)體驗(yàn)差異的整合互聯(lián)網(wǎng)和本地。但是這個(gè) 過(guò)程太漫長(zhǎng)了。眼看著adobe利用FLASH做跳板，以占領(lǐng)自己未來(lái)想占領(lǐng)的位置，自己能不能到達(dá)目的地還不好說(shuō)，于是在急匆匆中推出了 sliverlight。其實(shí)微軟本來(lái)沒(méi)有sliverlight研究計(jì)劃，希望借助VISTA一舉掀開(kāi)未來(lái)大幕，但VISTA不爭(zhēng)氣，沒(méi)掀好，于是必須應(yīng)急。

所以，奉勸開(kāi)發(fā)慣了網(wǎng)站的程序員，繼續(xù)拿起你們的AJAX，因?yàn)槟銈儾焕斫馊藗優(yōu)槭裁匆肁IR。

對(duì)于開(kāi)發(fā)慣了EXE的程序員，繼續(xù)使用AIR或WPF來(lái)開(kāi)發(fā)你們的下一代產(chǎn)品，別想著用FLEX。習(xí)慣用微軟技術(shù)的就用WPF，習(xí)慣用非微軟技術(shù)的，就選擇AIR。就這么簡(jiǎn)單。

我給大家列了一個(gè)對(duì)比列表，大家可以理解這個(gè)新技術(shù)和過(guò)去技術(shù)的相似和關(guān)聯(lián)。

AIR runtime=.net framework=JVM

AIR=WPF=JAVA Application

FLEX=Sliverlight=JAVA Applet

至于Google Gears，是互聯(lián)網(wǎng)向桌面融合的產(chǎn)物，而我們今天討論的是桌面向互聯(lián)網(wǎng)融合。雖然Google Gears、JAVA JSF、Adobe AIR/FLEX、微軟WPF/Sliverlight都是RIA的解決方案。但都是各自從各自的優(yōu)勢(shì)出發(fā)發(fā)展的技術(shù)方案

最后結(jié)尾總結(jié)關(guān)鍵幾句：

1 AIR是給習(xí)慣開(kāi)發(fā)EXE程序員準(zhǔn)備的非微軟技術(shù)的互聯(lián)網(wǎng)解決方案。習(xí)慣微軟技術(shù)的請(qǐng)離開(kāi)，習(xí)慣網(wǎng)站的請(qǐng)離開(kāi)

2 AIR工作在表現(xiàn)層。AIR只是一個(gè)客戶端表現(xiàn)，和AJAX是一樣的。都是HTML+JAVASCIRPT。不要奢望它能做各種業(yè)務(wù)處理和運(yùn)算。你的業(yè)務(wù) 可以包裝成webservice，也可以是PHP或JSP或asp.net頁(yè)面，調(diào)用方式可以是webservice，可以是httpservice，可以是remoting。這樣你的業(yè)務(wù)層就可以和表現(xiàn)層AIR交流數(shù)據(jù)了

3 AIR IDE只是HTML+AVACRIPT設(shè)計(jì)和調(diào)試工具，所以你也別奢望AIR IDE能象JAVA和C#的IDE環(huán)境那樣強(qiáng)大。你過(guò)去怎么設(shè)計(jì)和調(diào)試HTML+JAVASCRIPT，那么你現(xiàn)在仍然保持那種心態(tài)。

4 AIR不是FLASH。他們是兩種不同的應(yīng)用目的和技術(shù)發(fā)展方向。不要用FLASH開(kāi)發(fā)企業(yè)管理軟件，也不要用AIR開(kāi)發(fā)多媒體。雖然能，但不擅長(zhǎng)（就如你拿C來(lái)開(kāi)發(fā)WEB）。AIR不需要運(yùn)行在瀏覽器中，不需要使用FLASH容器。AIR有自己的容器和運(yùn)行環(huán)境。AIR和你的EXE是一樣的安裝和執(zhí)行。

5AIR和WPF都處于不成熟期，可以作項(xiàng)目，但不要把寶押在他們上面做下一代產(chǎn)品線（預(yù)計(jì)下下版應(yīng)該可以進(jìn)行企業(yè) 下一代產(chǎn)品線開(kāi)發(fā)，一般都是軟件3個(gè)版本后才強(qiáng)壯穩(wěn)定起來(lái)，按照競(jìng)爭(zhēng)的激烈程度，這個(gè)第三個(gè)正式版本時(shí)間會(huì)在明年的上半年）。不過(guò)你也不要等待他們成熟后再做再研究，這樣的等待就如同2001年等待JAVA成熟一樣?，F(xiàn)在JAVA是成熟了，但是你還有機(jī)會(huì)么？

6不要懷疑AIR和WPF是不是未來(lái)。業(yè)界早有共識(shí)，這就是未來(lái)。不要在GOOGLE WEBOS和客戶端OS之間選擇來(lái)選擇去，如果你是網(wǎng)站開(kāi)發(fā)人員，安心研究你的GOOGLE RIA技術(shù)。不要懷疑是跟微軟還是跟adobe。如果你一直在微軟的技術(shù)圈子中行走，那么你安心用你的WPF好了，都是未來(lái)。

7有許多人問(wèn)起來(lái)了SEO在AIR和FLEX上的缺陷。說(shuō)slivelight支持SEO和搜索友好。我想說(shuō)的一句是：開(kāi)發(fā)企業(yè)管理軟件，怕的就是搜索，怕的就是企業(yè)數(shù)據(jù)被搜索引擎搜索到。不能搜索到才好呢

8AIR為過(guò)去的EXE程序員提供了自動(dòng)版本檢測(cè)和自動(dòng)升級(jí)的API，這是讓C/S程序員非常興奮的一件事?；叵氘?dāng) 年，客戶端版本不一致，出了不少怪異的事情。AIR也提供了離線后暫時(shí)保存數(shù)據(jù)到本地內(nèi)嵌在AIR runtime中的sqlite(操作和平常SQL一樣)，繼續(xù)操作軟件，連線后同步數(shù)據(jù)。OK

9 你如果沒(méi)有開(kāi)發(fā)過(guò)MVC架構(gòu)，沒(méi)有用過(guò)COM多層開(kāi)發(fā)，那么你不會(huì)明白業(yè)務(wù)層和表現(xiàn)層的分工和通訊的。你會(huì)一直想弄清楚怎么在AIR中寫(xiě)SQL語(yǔ)句或 JAVA語(yǔ)句。你也一直會(huì)想在servlet中寫(xiě)JAVASCRIPT和HTML代碼。你還處在漿糊代碼階段，建議給自己的代碼技術(shù)升升級(jí)。

想問(wèn)我為什么關(guān)注AIR嗎？

因?yàn)槲乙恢睉?zhàn)斗在行業(yè)管理軟件的開(kāi)發(fā)上。我對(duì)于開(kāi)發(fā)一套C/S，一套B/S，這樣極耗費(fèi)開(kāi)發(fā)成本開(kāi)發(fā)時(shí)間和維護(hù)成本的開(kāi)發(fā)方式煩透了，要讓兩者操作習(xí)慣和功能都保持一致，難。如果有了BUG，兩個(gè)產(chǎn)品是兩個(gè)開(kāi)發(fā)團(tuán)隊(duì)，BUG都出在不同的地方，分別修改。讓一個(gè)公司維護(hù) 兩套人馬兩個(gè)產(chǎn)品，在中國(guó)大部分都是小軟件作坊的現(xiàn)狀下，哪個(gè)都做不好。不如做一個(gè)既是C/S又是B/S的軟件。

那是多么美好的事情啊。

posted @ 2008-08-25 10:20 天豬閱讀(2122) | 評(píng)論 (2) | 編輯收藏

天豬部落閣 - (ExtJS && AS3 && Java)

導(dǎo)航

公告

留言簿(1)

文章分類(lèi)(13)

隨筆檔案(10)

文章檔案(11)

相冊(cè)

閱讀排行榜

評(píng)論排行榜

常用鏈接

統(tǒng)計(jì)

FLASH

WORK

友情鏈接

最新評(píng)論