The previous section learned the environment of ext and the most basic operation-pop-up dialog box, as a primer, this section describes how to pop up a new form, from the example to explain the basic operating principle of ext.
What does ext form look like?First to look at a few effects, I believe that with the depth of study, we will be Ext's gorgeous conquered. Here are some of the basic forms of ext popup:
We can find that the 2 pop-up forms are much more beautiful than our traditional Web pages, and more valuable is the ability to switch styles at will. So how does this kind of form pop up?
Second, ext pop-up form ideasWhen the environment is set up correctly, the introduction of the page is also correct, you can follow the following ideas to write code:
First step: Build a basic code shelf, such as
<script type= "Text/javascript" >The second step: The new object, passing in the corresponding parameters. Common parameters are title (title), height (height), Width (width), content (HTML), and so on. These parameters are all enclosed in curly brackets, separated by commas in the middle of each parameter. The reference code is as follows:
After the arguments are passed in the constructor:
var win = new Ext.window ({title: "Test title", height:300, width:500, HTML: "Description: Where HTML attributes can be written and parsed HTML tags, can be modified inside the font and so on.
Finally, let the form object show up and call his show () method:
Win.show ();Then, run the webpage and get the following effect:
, this form can be dragged by default, and dragging the default effect is a shadow and background discoloration feature. In this example, the complete code is as follows:
<HTML>The Window object is a special panel that is dedicated to the window in your program. Windows by default is Draggable, floating, and provides a number of specific behaviors such as maximizing, restoring, and events. There are many other properties and events, this chapter is not detailed in the moment, because the course is just beginning, the following will provide the API documentation, you can refer to the implementation of more powerful pop-up form.
This chapter code download
Ext Introductory Learning Series (ii) Popup form
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
