EXT 2.0 learning controls

EXT is a framework based on ajax ui. It is mainly used as the UI and the designed form is very beautiful. Here we will not talk much about it. Let's look at the basic controls:

Demo1: panel control

 
Ext. onready (Function(){VaROBJ =NewExt. Panel ({width: 300, height: 200, items: [{Title :"P1", Height: 50 },{ title :"P2", Height: 50 },{ title :"P3", Height: 50}]}); obj. Render ("Cao");});
 

 
The effect is as follows:
 

 
Demo2: MessageBox Control
 

 
Code:
 

Ext. onready (Function() {Ext. MessageBox. Alert ("prompt ","This is one demo!");VaRWin =NewExt. Window ({Title: "prompt", width: 100, height: 110, HTML :"<Input type = 'text' value = 'cao 'name = 'mytext'>"}); Win. Show ();});
 

 
The effect is as follows:
 

 
Demo3: tabpanel Control
 

 
Code:
 

Ext. onready ( Function (){ VaR Tab = New Ext. tabpanel ({width: 300, height: 400, items :[ New Ext. Panel ({Title: "Panel 1 ", Height: 50, HTML :" <Input tyep = 'text' value = 'better tomorrow! '> "}), New Ext. Panel ({Title: "Panel 2 ", Height: 50, HTML :" <Input type = 'button 'name = 'myclick'> "}), New Ext. Panel ({Title: "Panel 3 ", Height: 50})]}); tab. Render (" Cao ");

 

The effect is as follows:

Here is a brief introduction. This web UI is quite good. Currently, this is used in some OA projects.

At present, I am not very familiar with this item. I can only introduce it to you with limited capabilities. Please wait for my next article.ArticleShow up