EXT.NET 使用總結（1）

hungerW發表於2013-12-31
前言

從系統改版到現在，將近半年的時間，原本陌生的Ext.NET的UI框架，也慢慢的熟悉了。總的來說，這個UI框架還是很優秀的，但是也沒有100%完美的產品（老系統使用easy ui其實也挺好的）。趁著這段時間不忙，來總結下（主要是一些奇怪的問題和一些控制元件的用法），也歡迎大家的補充及指正。

為什麼使用Ext.NET

當初決定改版用EXT.NET，主要是因為相容瀏覽器，以及是開發效率高。當然了，有些瀏覽器的相容性並不是十分完美，例如ie7。更多優點請參閱@雪雁--http://www.cnblogs.com/codelove/archive/2011/07/22/2114317.html。

開門見山

http://examples.ext.net/ ext.net官網，提供一些簡單的demo，這是主要資料的的來源，不過基本呢上能應付開發了。

NumberField 

數字框，初始化時的值必須為數字，如果有異常，初始化的值不值數值型別。當點選ext:Button 的Click事件時，無法監聽到Button 的Click事件。很鬱悶吧。

動態新增帶控制元件的資料集的GridPanel

html程式碼

 

 1     <ext:GridPanel ID="GridPanelGrade" AutoScroll="true" trackmouseover="true" AutoDestroy="true" Title="修改"
 2         Layout="VBoxLayout" runat="server" Width="960" AutoDoLayout="true" ColumnLines="true"
 3         Border="false" striperows="true" Cls="page">
 4         <CustomConfig>
 5             <ext:ConfigItem Name="AutoHeight" Value="true" Mode="Value">
 6             </ext:ConfigItem>
 7             <ext:ConfigItem Name="ForceFit" Value="true" Mode="Value">
 8             </ext:ConfigItem>
 9             <ext:ConfigItem Name="autoScroll" Value="true" Mode="Value">
10             </ext:ConfigItem>
11             <ext:ConfigItem Name="autoWidth" Value="false" Mode="Value">
12             </ext:ConfigItem>
13         </CustomConfig>
14         <Store>
15             <ext:Store ID="StoreGrade" runat="server">
16                 <Model>
17                     <ext:Model ID="StoreGrade_Mode" runat="server">
18                     </ext:Model>
19                 </Model>
20             </ext:Store>
21         </Store>
22         <ColumnModel ID="ColumnModel1" runat="server">
23             <Columns>
24             </Columns>
25         </ColumnModel>
26     </ext:GridPanel>

 

後臺程式碼：

        void Innit_DATA()
        {
            //資料集
            List<List<string>> results = new List<List<string>>();
                    for (int i = 0; i < list_Idx.Count; i++)
                {
                    List<string> ss = new List<string>();
                    string ssr = Addstep(list_Idx[i].level);
                    ss.Add(ssr + list_Idx[i].name);
                    results.Add(ss);
                }
            List<ColumnBase> extColumnBase = new List<ColumnBase>();
            Model _ExtModel = new Model();

            #region MyRegion

            //構建列頭
            extColumnBase.Add(new Column
            {
                ID = "TARGETNAME",
                Text = "指標名稱",
                DataIndex = "TARGETNAME",
                Sortable = false,
                MenuDisabled = true,
                Width = 194,
                Flex = 1
            });

            _ExtModel.Fields.Add(new ModelField("TARGETNAME"));
            if (dtsource.Rows.Count > 0)
            {
                for (int i = 0; i < dtsource.Rows.Count; i++)
                {
                    string ids = "A" + tableName + i;
                    //extColumnBase.Add(new Column
                    //{
                    //    ID = ids,
                    //    Text = GetReptorNmae(dtsource.Rows[i][1].ToString()),
                    //    DataIndex = ids,
                    //    Sortable = false,
                    //    MenuDisabled = true,
                    //    Flex = 1
                    //});
                    ComponentColumn columm = null;
                    columm = new ComponentColumn();
                    columm.ID = ids;
                    columm.DataIndex = ids;
                    columm.Text = GetReptorNmae(dtsource.Rows[i][1].ToString());
                    columm.Flex = 1;
                    columm.Editor = true;
                    TextField textField = new TextField();
                    columm.Component.Add(textField);
                    extColumnBase.Add(columm);

                    _ExtModel.Fields.Add(new ModelField(ids));
                }
            }
            //清除舊資料與記錄集
            this.StoreGrade.Reader.Clear();
            this.GridPanelGrade.SelectionModel.Clear();
            this.GridPanelGrade.ColumnModel.Columns.Clear();
            this.StoreGrade.Model.Clear();


            this.StoreGrade.Model.Add(_ExtModel);
            this.GridPanelGrade.ColumnModel.Columns.AddRange(extColumnBase);
            this.StoreGrade.DataSource = results;
            this.StoreGrade.DataBind();
            this.GridPanelGrade.Render();
}

 

效果圖：

 

 

 

 

 

 

相關文章