EditorGridPanel(可編輯的網格控件)

這一節，我們將看到ExtJs功能強大的可編輯網格控件，幾乎與VS.Net的GridView功能一樣了，但是ExtJs的可是純JS的UI

一.靜態示例(改自ExtJs的官方示例)

a.因為我們是采用xml做為數據源的，這里貼出xml的內容

Code

 

  
    紅竹
    產自加拿大
    4
    喜陰
    2.44
    03/15/2006
    0
    
  
    紫羅蘭
    Erythronium americanum
    4
    半陰半光
    9.04
    02/01/2006
    1
   

b.ExtJs調用頁面

    
    
     
         
    






    陰
    喜陰
    半陰半光
    喜光
    日光




亚洲国产欧美图片,亚洲aⅴ在线av,日韩亚洲综合图片视频,日本av精品在线中文

二.結合WCF動態讀取

1.WCF服務端

[OperationContract]
        [WebInvoke(ResponseFormat = WebMessageFormat.Xml, Method = "GET", UriTemplate = "GetData")]
        public T_Class[] GetData()
        {
            List _Result = new List();
            using (DBDataContext db = new DBDataContext())
            {
                _Result = db.T_Classes.Where(c => (new string[] { "shop", "product" }).Contains(c.F_Type.ToLower())).Take(30).ToList();               
                db.Connection.Close();
            }
            return _Result.ToArray();
        }

注意:為使linq to sql中的類支持WCF數據契約，還是要手動對類添加[DataContract]標志，對字段添加[DataMember]標志，否則無法序列化；另外對于System.DateTime類型的字段，最終序列化成xml時，格式類似2007-03-07T15:48:04，ExtJs不能正確識別這種格式，無奈之下，只好手動修改*.designer.cs文件中自動生成的T_Class類，把F_AddTime手動修改為System.String類型，同時人工處理返回格式，如下：

[Column(Storage="_F_AddTime", DbType="DateTime")]
        [DataMember]
        public string F_AddTime
        {
            get
            {
                return CNTVS.TOOLS.Utils.FormatDateString(this._F_AddTime,"yyyy-mm-dd");
            }
            set
            {
                if ((this._F_AddTime != value))
                {
                    this.OnF_AddTimeChanging(value);
                    this.SendPropertyChanging();
                    this._F_AddTime = value;
                    this.SendPropertyChanged("F_AddTime");
                    this.OnF_AddTimeChanged();
                }
            }
        }

這里，我調用了自己寫的一個工具庫的FormatDateString方法，當然大家也可以自己定義返回的格式，只要ExtJs能識別就可以了

2.前端頁面，跟靜態示例幾乎一樣，貼一下代碼:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="03_Grid_Editable.aspx.cs" Inherits="Ajax_WCF._3_Grid_Editable" %>





        
     
         
    
    





    商家分類
    產品分類
    地區分類