原博文http://www.cnblogs.com/sanshi/archive/2012/02/12/2347789.html
1.首先复制extJS的文件夹到根目录。
2.引用程序集
3.配置配置文件:
1 <?xml version="1.0"?>
2 <configuration>
3 <!--1.0配置Session-->
4 <configSections>
5 <section name="FineUI" type="FineUI.ConfigSection, FineUI" requirePermission="false" />
6 </configSections>
7 <!-- 可用的配置项(这里列的都是默认值):
8 Language="zh_CN"
9 AjaxTimeout="120"
10 EnableAjax="true"
11 Theme="Neptune"
12 FormMessageTarget="Qtip"
13 FormOffsetRight="0"
14 FormLabelWidth="100"
15 FormLabelSeparator=":"
16 IconBasePath="~/res/icon"
17 EnableAjaxLoading="true"
18 AjaxLoadingType="default"
19 CustomTheme=""
20 CustomThemeBasePath="~/res/theme"
21 -->
22
23 <FineUI DebugMode="false" />
24
25 <system.web>
26
27 <pages controlRenderingCompatibilityVersion="4.0" clientIDMode="AutoID">
28 <controls>
29 <add assembly="FineUI" namespace="FineUI" tagPrefix="x" />
30 </controls>
31 </pages>
32 <httpModules>
33 <add name="FineUIScriptModule" type="FineUI.ScriptModule, FineUI" />
34 </httpModules>
35 <httpHandlers>
36 <add verb="GET" path="res.axd" type="FineUI.ResourceHandler, FineUI" validate="false" />
37 </httpHandlers>
38
39
40 <httpRuntime maxRequestLength="102400 " />
41 <customErrors mode="Off" />
42 <compilation debug="true" targetFramework="4.5"/>
43
44 </system.web>
45
46
47 <runtime>
48 <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
49 <dependentAssembly>
50 <assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" culture="neutral" />
51 <bindingRedirect oldVersion="0.0.0.0-6.0.0.0" newVersion="6.0.0.0" />
52 </dependentAssembly>
53 </assemblyBinding>
54 </runtime>
2 <configuration>
3 <!--1.0配置Session-->
4 <configSections>
5 <section name="FineUI" type="FineUI.ConfigSection, FineUI" requirePermission="false" />
6 </configSections>
7 <!-- 可用的配置项(这里列的都是默认值):
8 Language="zh_CN"
9 AjaxTimeout="120"
10 EnableAjax="true"
11 Theme="Neptune"
12 FormMessageTarget="Qtip"
13 FormOffsetRight="0"
14 FormLabelWidth="100"
15 FormLabelSeparator=":"
16 IconBasePath="~/res/icon"
17 EnableAjaxLoading="true"
18 AjaxLoadingType="default"
19 CustomTheme=""
20 CustomThemeBasePath="~/res/theme"
21 -->
22
23 <FineUI DebugMode="false" />
24
25 <system.web>
26
27 <pages controlRenderingCompatibilityVersion="4.0" clientIDMode="AutoID">
28 <controls>
29 <add assembly="FineUI" namespace="FineUI" tagPrefix="x" />
30 </controls>
31 </pages>
32 <httpModules>
33 <add name="FineUIScriptModule" type="FineUI.ScriptModule, FineUI" />
34 </httpModules>
35 <httpHandlers>
36 <add verb="GET" path="res.axd" type="FineUI.ResourceHandler, FineUI" validate="false" />
37 </httpHandlers>
38
39
40 <httpRuntime maxRequestLength="102400 " />
41 <customErrors mode="Off" />
42 <compilation debug="true" targetFramework="4.5"/>
43
44 </system.web>
45
46
47 <runtime>
48 <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
49 <dependentAssembly>
50 <assemblyIdentity name="Newtonsoft.Json" publicKeyToken="30ad4fe6b2a6aeed" culture="neutral" />
51 <bindingRedirect oldVersion="0.0.0.0-6.0.0.0" newVersion="6.0.0.0" />
52 </dependentAssembly>
53 </assemblyBinding>
54 </runtime>
55 </configuration>
4.前端界面代码:
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="_02Code.Login" %>
2
3 <!DOCTYPE html>
4
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head runat="server">
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title></title>
9 </head>
10 <body>
11 <form id="form1" runat="server">
12 <x:PageManager ID="PagerManager1" runat="server"></x:PageManager>
13 <x:Window ID="window1" runat="server" Title="登录表单" IsModal="false" EnableClose="false" WindowPosition="GoldenSection" Width="350">
14 <Items>
15 <x:SimpleForm ID="SimpleForm1" runat="server" ShowBorder="false" BodyPadding="10px" LabelWidth="60px" ShowHeader="false">
16 <Items>
17 <x:TextBox ID="txtName" Label="登录名" runat="server" Required="true"></x:TextBox>
18 <x:TextBox ID="txtPwd" runat="server" Label="密码" TextMode="Password" Required="true"></x:TextBox>
19 <x:Button Text="登录" ID="btnLogin" runat="server" Type="Submit" ValidateForms="SimpleForm1" ValidateTarget="Top" OnClick="btnLogin_Click"></x:Button>
20 </Items>
21 </x:SimpleForm>
22 </Items>
23 </x:Window>
24 </form>
25 </body>
26 </html>
3 <!DOCTYPE html>
4
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head runat="server">
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title></title>
9 </head>
10 <body>
11 <form id="form1" runat="server">
12 <x:PageManager ID="PagerManager1" runat="server"></x:PageManager>
13 <x:Window ID="window1" runat="server" Title="登录表单" IsModal="false" EnableClose="false" WindowPosition="GoldenSection" Width="350">
14 <Items>
15 <x:SimpleForm ID="SimpleForm1" runat="server" ShowBorder="false" BodyPadding="10px" LabelWidth="60px" ShowHeader="false">
16 <Items>
17 <x:TextBox ID="txtName" Label="登录名" runat="server" Required="true"></x:TextBox>
18 <x:TextBox ID="txtPwd" runat="server" Label="密码" TextMode="Password" Required="true"></x:TextBox>
19 <x:Button Text="登录" ID="btnLogin" runat="server" Type="Submit" ValidateForms="SimpleForm1" ValidateTarget="Top" OnClick="btnLogin_Click"></x:Button>
20 </Items>
21 </x:SimpleForm>
22 </Items>
23 </x:Window>
24 </form>
25 </body>
26 </html>
就这么简单。第一个界面搭建完了。
小结:
1)Alert的提示
2)window窗体控件,和他的属性WindowPosition="GoldenSection"
3)控件ext:SimpleForm,简单表单,和button配合用。
4. 表单回发不是整个页面的回发,而是AJAX(这也是ExtAspNet所特有的原生AJAX,无需任何配置和特殊的代码就默认拥有AJAX特性)