Anyone who has used Ext has experienced the strength of the JavaScript library, but the learning threshold for this library is high. Now we have an Asp.net server control that encapsulates the Ext library. Currently there are two versions, which are supported respectively. NET2.0 and. NET3.5. I tried it myself. NET3.5 contains 14 sub-controls, including ScriptManager, ScriptContainer, HtmlEditor, Panel, DataPicker, HiddenField, RadioButton, Calendar AR, FieldSet, CheckBox, TextArea, TextBox, NumberTextBox, and Window.
If you are interested, you can download the following link:
Coolite Studio (ASP. NET) Download
Demo effect:
How to skin?
There are many methods:
Method 1: add the header label to the Aspx File
<Head runat = "server" lang = "zh-cn">
<Title> No title page </title>
<Cool: ScriptContainer ID = "ScriptContainer1" runat = "server">
</Cool: ScriptContainer>
<Link href = "Path of the CSS file corresponding to the skin" rel = "stylesheet" type = "text/css"/>
</Head>
Method 2: In the post code, set:
<Script runat = "server">
Protected void Page_Load (object sender, EventArgs e)
{
Coolite. Web. UI. ScriptManager. RegisterSessionTheme (Coolite. Web. UI. Theme. Gray );
}
</Script>
Or
<Script runat = "server">
Protected void Page_Load (object sender, EventArgs e)
{
HttpContext. Current. Session ["Coolite. Theme"] = Coolite. Web. UI. Theme. Gray;
}
</Script>
Method 3: Use the configuration file:
1 <? Xml version = "1.0"?>
2
3 <configuration>
4 <configSections>
5 <section name = "coolite" type = "Coolite. Web. UI. GlobalConfig"/>
6 </configSections>
7 <! -- Coolite global configuration attributes -->
8 <! -- CleanResourceUrl = true | false
9 The Coolite controls can clean up the autogenerate WebResource Url so they look presentable.
10 Default is true -->
11 <! -- Gzip = true | false
12 Whether to automatically render scripts with gzip compression.
13 Default is true. -->
14 <! -- ScriptAdapter = Ext, jQuery, Prototype, YUI
15 Which script adapter to use.
16 Default is "Ext" -->
17 <! -- RenderScripts = true | false
18 Whether to have the coolite controls output the required JavaScript between des or not.
19 Gives developer option of manually including required <script> files.
20 Default is true -->
21 <! -- RenderStyles = true | false
22 Whether to have the coolite controls output the required StyleSheet between des or not.
23 Gives developer option of manually including required <link>/<style> files.
24 Default is true -->
25 <! -- ScriptMode = Release, Debug
26 Whether to include the Release (condensed) or Debug (with documentation) JavaScript files
27 Default is "release" -->
28 <! -- Theme = Default, Gray
29 Which embedded theme to use.
30 Default is "Default" -->
31 <coolite
32 cleanResourceUrl = "true"
33 gzip = "true"
34 scriptAdapter = "Ext"
35 renderScripts = "true"
36 renderStyles = "true"
37 scriptMode = "Release"
38 theme = "Gray"
39/>
40 </configuration>
The first method used for testing is as follows:
Note: The control by default only includes two styles of themes, more themes can be ExtJS official website download: http://extjs.com/learn/Ext_Extensions#User_Themes
During use, you only need to copy the content in the package to the corresponding directory.
The default language is English. How can I set it to Chinese?
You need to download Ext2.0 to Ext official website, there is a ext-lang-zh_CN.js file in the folder, This is a Chinese Language Pack, add to the corresponding directory of the website, and then use the ScriptManager control to import js files:
<Asp: ScriptManager ID = "ScriptManager2" runat = "server">
<Scripts>
<Asp: ScriptReference Path = "corresponding directory/ext-lang-zh_CN.js"/>
</Scripts>
</Asp: ScriptManager>
