extjs Technical communication , Welcome to add group (201926085)

1. The code is as follows :

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title></title>
5 <!--ExtJs Frame start -->
6 <script type="text/javascript" src="/Ext/adapter/ext/ext-base.js"></script>
7 <script type="text/javascript" src="/Ext/ext-all.js"></script>
8 <link rel="stylesheet" type="text/css" href="/Ext/resources/css/ext-all.css" />
9 <!--ExtJs The frame ends -->
10 <script type="text/javascript">
11 Ext.onReady(function () {
12 var win = new Ext.Window({
13 title: ' window ',
14 width: 476,
15 height: 374,
16 html: '<div> Here is the form content </div>',
17 resizable: true,
18 modal: true,
19 closable: true,
20 maximizable: true,
21 minimizable: true
22 });
23 win.show();
24 });
25 </script>
26 </head>
27 <body>
28 <!--
29 explain :
30 (1)var win = new Ext.Window({}): Create a new Window Form object .
31 (2)title: ' window ': The title of the form .
32 (3)width: 476,height: 374: Width and height .
33 (4)html: '<div> Here is the form content </div>': Inside the form html Content .
34 (5)resizable: true: Whether the form can be resized , I'm going to set it to true.
35 (6)modal: true: Is modal form [ What is modal form ? When you open this window , If you can't operate on other forms , So this form is the modal form , Otherwise, it is a non modal form ].
36 (7)closable:true: Can I close , It can also be understood as whether to display the close button .
37 (8)maximizable: true: Is it possible to maximize , It can also be understood as whether to display the maximize button .
38 (9)minimizable: true: Is it possible to minimize , It can also be understood as whether to display the minimize button .
39 (10)win.show(): Form display .
40 -->
41 </body>
42 </html>

2. The effect is as follows :

3.window Components are commonly used : attribute 、 Methods and events

One 、 attribute  
plain: Boolean type ,true Means to force coordination with the background color , The default value is false. 
resizable: Boolean type , Whether the user can adjust the size of the form , The default value is true It means it can be resized . 
maxinizable: Boolean type ,true Represents the display maximize button , The default value is false. 
maximized: Boolean type ,true Represents to maximize the form when it is displayed , The default value is false. 
closable: Boolean type ,true Indicates the display close button , The default value is true. 
bodyStyle: The distance from the border , Such as :bodyStyle:"padding:3px". 
buttonAlign: In form button The alignment of (left、center、right), The default value is right. 
closeAction:"close" Free the memory occupied by the form ,"hide" Hide form , It is recommended to use "hide".

Two 、 Method  
show: Open form . 
hide: Hide form . 
close: Closing Windows .

3、 ... and 、 event  
show: Touch when opening a form . 
hide: Touch when hiding a form . 
close: Touch when closing the form .

Never too old , Too old to learn , Practice till you get old ...
 

No nonsense ExtJs Introductory course 3 [ forms :Window Components ] More articles about

  1. No nonsense ExtJs Introductory course 7 [ Login form Demo:Login]

    No nonsense ExtJs Introductory course 7 [ Login form Demo:Login] extjs Technical communication , Welcome to add group (201926085) In this section, we will make a landing page through the previous sections , Let's go through the previous sections . 1. The code is as follows : ...

  2. No nonsense ExtJs Introductory course 15 [ Employee information form Demo:AddUser]

    No nonsense ExtJs Introductory course 15 [ Employee information form Demo:AddUser] extjs Technical communication , Welcome to add group (201926085) We have introduced 10 A form component , These components are the most frequently used in our development process , So one ...

  3. No nonsense ExtJs Introductory course 21 [ Inherit :Extend]

    No nonsense ExtJs Introductory course 21 [ Inherit :Extend] extjs Technical communication , Welcome to add group (201926085) In development , When we use the view component , Always set the width , Height , Title and other attributes . And these attributes can be accessed through “ Inherit ” ...

  4. No nonsense ExtJs Introductory course 20 [ Data interaction :AJAX]

    No nonsense ExtJs Introductory course 20 [ Data interaction :AJAX] extjs Technical communication , Welcome to add group (521711109) 1. The code is as follows : 1 <!DOCTYPE html PUBLIC "-//W3C ...

  5. No nonsense ExtJs Introductory course 17 [ list :GridPanel]

    No nonsense ExtJs Introductory course 17 [ list :GridPanel] extjs Technical communication , Welcome to add group (201926085) stay Extjs in ,GridPanel For data display , That is what we usually call the list page . In this section , Let's start with ...

  6. No nonsense ExtJs Introductory course 14 [ Text editor :Editor]

    No nonsense ExtJs Introductory course 14 [ Text editor :Editor] extjs Technical communication , Welcome to add group (201926085) ExtJs The built-in editor doesn't have the function of uploading pictures , Most of the time, it can meet our needs . But sometimes this work ...

  7. No nonsense ExtJs Introductory course 13 [ To upload pictures :File]

    No nonsense ExtJs Introductory course 13 [ To upload pictures :File] extjs Technical communication , Welcome to add group (201926085) 1. The code is as follows : 1 <!DOCTYPE html PUBLIC "-//W3C ...

  8. No nonsense ExtJs Introductory course 12 [ Drop down list linkage :Combobox_Two]

    No nonsense ExtJs Introductory course 12 [ Drop down list linkage :Combobox_Two] extjs Technical communication , Welcome to add group (201926085) No matter how many levels of drop-down list are linked, the implementation is essentially based on the change of a drop-down list , To dynamically load its ...

  9. No nonsense ExtJs Introductory course 11 [ The drop-down list :Combobox]

    No nonsense ExtJs Introductory course 11 [ The drop-down list :Combobox] extjs Technical communication , Welcome to add group (201926085) Continuing from the previous section , We added a drop-down list to the form : 1. The code is as follows : 1 <!DOCT ...

Random recommendation

  1. pure javaScript、jQuery Realize personalized image rotation

    pure javaScript Realize personalized image rotation The principle of carousel < As shown in the figure above >: 1. The canvas section ( Visual area ) Attribute specification :overflow:hidden Make the part beyond the canvas hidden or invisible .position: ...

  2. c# In the abstract class (abstract) And interface (interface) The similarities and differences of

    The same thing : 1. Can be inherited 2. Can't be instantiated 3. Can contain method declarations 4. Derived classes must implement unimplemented methods difference : 1. Abstract base classes can define fields . attribute . Method realization . Interfaces can only define properties . Indexer . event . And method statements , No ...

  3. &amp; And &amp;&amp;,| And ||

    http://bokeid.blog.163.com/blog/static/93102786201181710259178/ &&: Logical operators , Joins two or more expressions , The result is TRUE or ...

  4. About some learning html and css The notes

    One .Html brief introduction Full write : HyperText Mark-up Language  Translated names :  Hypertext markup language   concise explanation : A language that marks certain words and sentences in a common document , The goal is to use labels (tag) Make the document   Achieve the expected ...

  5. django Introductory tutorial ( Next )

    In two articles to help you get started Django( On ) In the article , We've made a simple little website , Save user data to database , And read data from the background database and display it on the web page . There seems to be no problem , But we can make it more complete ...

  6. 29、Jquery Ajax

    Ajax Asynchronsous Javascript and XML( asynchronous Javascript and XML). Ajax It's a situation where you don't have to reload the entire page , Technology for updating local pages . It's not a single technique ...

  7. WebConfig Escape of special characters !

    Web.Config The default encoding format is UTF-8, about XML file , To use entity escape code to replace . The correspondence is as follows : character Escape code & Symbol & & Single quotation marks ' &apos; Double quotes ...

  8. java Concurrent programming | Lock details :AQS,Lock,ReentrantLock,ReentrantReadWriteLock

    original text :java Concurrent programming | Lock details :AQS,Lock,ReentrantLock,ReentrantReadWriteLock lock Locks are used to control the way multiple threads access shared resources ,java Can be used in synch ...

  9. Work VUE Layout records

    Take this page as an example   This is how many lines your layout has , This page has two lines , Here is 2       here span How many spaces does it take ( altogether 24 grid )offset Shift left and right , This is basically useless row It represents the line of the control , If it's in the second ...

  10. android Event binding

    layout The layout designs the page , How to bind events , Interaction with users needs to be done in Activity Intermediate processing . Below layout, There are two buttons . <LinearLayout android:layout_width ...