WebGridView

【功能說明】

用途：使用于 Web 網頁中，繼承自 GridView 元件， 此元件的主要功能是以表格的方式顯示多筆資料內容。

【元件屬性】

ID ( 元件名稱 ) (string)

用於識別該組件。

DataSourceID ( 資料源 ) (string)

對應到 WebGridView 的資料源代號，就是指 WebDataSource 。

AddIndentityField ( 自增值欄位 ) ( bool)

用來自動增加一個 IndentityField 自增值欄位，此欄位是由系統產生，並不必使用實體欄位，這裡會自動依 WebGridView 的次序自動顯示一個序號，用來標示給 User 查看。

Caption( 抬頭 )(string)

元件上面的抬頭文字內容。

ExpressionFieldCount ( 運算式欄位數 ) ( int)

用於指示該 WebGridView 中 ExpressionField 的數量，設置此屬性後設計者必須進入 Fields 屬性來對 ExpressionField 進行設定 ( 包括 Expression 屬性等 ) ，才能使用。

Columns ( 欄位明細 )(collection)

設定 WebGridView 中所有欄位的明細，如下說明：

  HeaderText ( 表頭文字 )(string): 每個欄位上方的欄位表頭內容。

  HeaderImageURL ( 表頭圖示 )(string): 每個欄位上方的表頭圖示。

  ApplyFormatInEdit ( 編輯時使用格式 )( bool): 此欄位編輯時是否使用 DataFormatString 格式。

InsertVisibll ( 新增顯示 )( bool): 新增時是否要顯示此欄位。

Visibll ( 顯示 )( bool): 在 WebGridView 中是否顯示該欄位。

ReadOnly ( 唯讀 )( bool): 是否唯讀，不能新增 / 更改 / 刪除。

ShowHeader ( 顯示表頭 )( bool): 該欄位是否顯示上面的抬頭。

DataField ( 欄位名稱 )( strring): 對應的欄位名稱。

DataFormatString ( 欄位格式 )( strring): 對應的欄位格式內容，請參考 VS 手冊說明。

ItemStyle( 資料頁面型態 ): 設定此欄位在顯示時其頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

HeaderStyle( 表頭頁面型態 ): 設定此欄位抬頭的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

FooterStyle( 表尾頁面型態 ): 設定此欄位表尾頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

AddNewRowControls ( 新增元件明細 ) (Collection)

如果你允許 WebGridView 可以自由新增資料時，系統會自動在 WebGridView 的 Footer 中增加一個空的 Row 讓 User 新增，一般都會以標準的 TextBox 來讓 User 輸入，如果你想在更改或新增時能以特殊的元件來讓 User 輸入者，可以先將此特殊欄位轉換成 TemplateField 後 ( 在 Columns 屬性中轉 ) ，在 TemplateField 設定時，只能設定 ItemTemplate ( 顯示用 ) ， EditTemplate ( 更改用 ) ，因為 WebGridView 並沒有 InsertTemplate ，因此我們只能定義在 FooterTemplate 中，除此之外，就是還要在本屬性中將此 AddNewRowControls 的 FieldName 要對應上 FooterTemplate 中的 ControlID ，這樣即可以讓 WebGridView 在新增時使用特殊的元件。 在此 Collenction 中，其設定說明如下：

FieldName ( 欄位名稱 )(string): 只要新增的欄位名稱，要與相對的 WebGridView 欄位對應上。

ControlID ( 元件名稱 )(string): 代表所要對應的元件名稱 , 就是貼在 FooterTemplate 中用來新增的元件名稱。

ControlType ( 元件型態 ) ( enum) ： 可以設定為 TextBox ， CheckBox ， RefVal ， DateTimePicker ， DropDownList 等。

CreateInnerNavigator ( 內建 Navigator)( bool)

用於指示是否在該 WebGridView 中建立內建的 WebNavigator ，一般此 Navigator 會自動放在 DetailsView 的 Footer 中，內建的 Navigator 會預設新增 / 更改 / 刪除 / 查詢的按鈕。

GetServerText (Server 端訊息 )( bool)

控制內建 WebNavigator 所顯示文字，是否去抓取 Server 端的多國語言訊息，即存在 SYSMSG.XML 中的 WebNavigator 訊息。

InnerNavigatorShowStyle ( 內建 Navigator 型態 ) ( enum)

可設定為 ( HyperLink,Image,Button) ，只內建 WebNavigator 所顯示按鈕的外觀形式， HyperLink 代表連結 Label ， Image 代表圖示， Button 代表按鈕。

InnerNavigatorLinkLabel ( 對應狀態標籤 ) (string)

可以將內建 Navigator 的狀態訊息對應到一個 Label 上來顯示，狀態一般會有：瀏覽 / 更改中 / 新增中 / 存檔成功 / 存檔放棄等訊息。

NavControls (Navigator 明細 )(collection)

可以設定內建 Navigator 的各按鈕的明細，其屬性說明如下：

  ControlVisible ( 是否顯示 )( bool) ： 該按鈕是否顯示。

  ImageURL ( 圖示 URL)( bool) ： 該按鈕的對應 URL 圖檔案。

  MouseOverImageURL ( 作用圖示 URL)( bool) ： 該按鈕 Mouser 移過所對應的 URL 圖檔案。

  Size  ( 寬度大小 )(int32) ： 該按鈕的寬度大小。

  ControlName ( 元件名稱 )( bool) ： 該按鈕的元件名稱。

  ControlText ( 按紐文字 )(string) ： 該按鈕的文字內容。

  ControlType ( 按紐類型 )( enum) ： 該按鈕的型態，可設為 ( HyperLink,Image,Button) 。

在 WebGridView 中預設有新增 / 存檔 / 取消 / 查詢等按鈕，更改 / 刪除則一般置於 CommandFields 中。

HorizontalAlign( 左右對齊方式 )(enum)

用來設定左右的對齊方式，可以利用此屬性設定此元件的版面靠左 / 靠右 / 靠中等。

EditUrl ( 編輯連結 ) (string)

可以設定另一連結網頁 (.ASPX) 來進行新增 / 編輯 / 查看資料，即指定到另一的頁的 url ，該頁須另外自行設計，並且該頁中須配合一個 WebTranslate 元件，用來控制返回原 WebGridView 的頁面，並處理返回後資料的更新。

OpenEditHeight ( 編輯連結高度 ) ( int)

用來設置打開 EditUrl 頁面時的高度。

OpenEditWidth ( 編輯連結寬度 ) ( int)

用來設置打開 EditUrl 頁面時的寬度。

OpenEditUrlInServerMode ( 以 Server 模式打開 編輯連結 )( bool)

設置打開 EditUrl 頁面時是否已 Server 模式打開， ServerMode 和 ClientMode 區別在於， ServerMode 時會造成打開 EditUrl 頁面時父畫面出現刷新。

TotalActive ( 是否加總 )( bool)

指示是否在 WebGridView 的 Footer 中顯示相應的 Total 值， Total 的欄位將在 TotalColumns 中定義之。

TotalColumns ( 加總明細 )( collectioon)

用來設定 Total 的 Columns 的明細，所設定的 Column 在 WebGridView 的 Footer 中會顯示相應的 Total 值 ( 前提是 TotalActive 屬性為 true), 此 Collection 屬性說明如下：

FieldName ( 欄位名稱 )(string): 代表要加總的欄位名稱。

ShowTotal ( 是否顯示加總 ) ( bool) ： 代表是否要顯示此欄位的 Total 值。

TotalMode ( 加總模式 )( enum) ： 代表此列的 Total 值的加總模式，可設定為 none ：不加總， sum ：累加加總， count ：記次加總 ;max ：取最大值， min ：取最小值， average ：取平均值等。

HeaderStyleWrap ( 表頭文字換行 )(bool)

用來統一控制各個 Column 的 HeaderStyle 中 Wrap 的值。

EditRowStyle( 編輯頁面型態 )

用來設定更改編輯時其頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

RowStyle( 資料頁面型態 )

用來設定資料顯示時其頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

HeaderStyle( 表頭頁面型態 )

用來設定表頭頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

FooterStyle( 表尾頁面型態 )

用來設定表尾頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

InsertRowStyle( 新增頁面型態 )

用來設定新增資料時的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

EmptyDataRowStyle( 空白資料型態 )

用來設定空白資料時其頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

PagerStyle( 分頁頁面型態 )

用來設定表尾分頁的頁面上的前景背景顏色，字型，自動換列，邊框顏色型態大小等等。

EmptyDataText( 空白資料文字 )(string)

用來設定空白資料時所要顯示的文字內容。

TotalCaption ( 加總抬頭 )(string)

能在 TotalActive =True 時能顯示加總抬頭在 Footer 上 .

AutoPostBackMultiCheckBoxes ( 多個控制項 )( bool)

此專門用來配合一次可以直接在 ItemTemplate 中輸入多筆 CheckBox 元件，為 True 代表啟動，使用時需配合 WebGridView 中要貼入 WebCheckBox 元件才能正常運作。

AutoPostBackWebGridDropDown ( 多個控制項 )( bool)

此專門用來配合一次可以直接在 ItemTemplate 中輸入多筆 DropDownList 元件，為 True 代表啟動，使用時需配合 WebGridView 中要貼入 WebDropDownList 元件才能正常運作。

AutoPostBackWebGridTextBoxs ( 多個控制項 )( bool)

此專門用來配合一次可以直接在 ItemTemplate 中輸入多筆 TextBox 元件，為 True 代表啟動，使用時需配合 WebGridView 中要貼入 WebGridTextBox 元件才能正常運作。

MultiCheckColumn ( 控制項欄位名稱 )(string)

此配合 AutoPostBackMultiCheckBoxes =True 時使用，須配合定義本屬性要搭配的欄位名稱，本欄位只能是 Bit 型態的欄位。

Params ( 參數 ) (Collection)

此 屬性可設定哪些 參數需要在 EditURL 中的 WebTranslate 保存 後保留下 來， 　只要在 Params 中增加 一項 參數 "Filter"( 過濾條件 ) 就可以 記下 查詢條件

EditURLPanel ( 編輯鏈接的 ModalPanel )(string)

用於 設定關聯 對應的 AjaxModalPanel ，讓 WebGridView 在 Insert/Update/View 時可以 將此 AjaxModalPanel 打開，並以 ShowModal 方式呈現。

 

【功能函數】

  ToExcel () ：依照 WebGridView 內的 Control 來輸出 , 只要 Control 內有 text 的屬性的資料都可以輸出到 Excel 中 , 並按 WebGridView 的欄位次序輸出。

 

【 事件 】

Adding(EventArgs e)

用於 控制新增 Button 按下 後，要配合 執行的功能， Adding 則是指新增前。

Added( EventArgs e)

用於 控制 OK Button 按下 後，要配合 執行的功能， Added 則是指新增 後。

 

【其他說明】

1. 如果要刪除 WebGridView 中的 ExpressionField ，必須先在 Fields 屬性中刪除此 ExpressionField ，再將 ExpressionFieldCount 屬性的值減去相應已刪除 ExpressionField 的數量即可。

2. WebGridView 的設計模式中 , 可以用右鍵的 AdjustColumn 功能，自動以 COLDEF 的 Field_Length 來自動決定其相對欄位的寬度 ( 全部調整 HeaderStyle.Width ， 並以百分比來調整 ) ， 如果當 field_length 沒有設定時，則 Varchar 都當作 20 ， 數值與其他都當作 10 來計算，再用此 Width 除以總寬度 ( 所有欄位的總計 ) ， 得到百分比。

3. WebGridView 在設計模式中，可以用右鍵 'Copy AddNewControls' 功能，自動將 FooterTemplate 內的元件 Copy 進去 WebGridView 的 AddNewControls 中，這是為了讓開發者方便自動 Copy 有設 TemplateField 的欄位，自動將其 FooterTemplate 的元件 Copy 到 AddNewControls 中，以簡化設計。

4. 請注意， TotalCaption 屬性一定要配合第一個 WebGridView 的 Column 要不為 Binding 的欄位，否則無法顯示出 TotalCaption 在 Footer 中。

5. WebGridView 在 EditURL 方式中實現連續新增，目前方法為 : 在 Formview 上貼一個 " 繼續新增 " 的 Button ，執行以下程式即可 :

　 FormView.InsertItem ( false);

　 FormView.ChangeMode ( FormViewMode.Insert );

 

【 範例 】

利用 RowDataBound 的事件來設定欄位的初值， 如下 :

protected voidWebGridView1_RowDataBound( objectsender, GridViewRowEventArgse)

{

// 做 Default 操作 (Insert 時使用 )

if (e.Row.RowType == DataControlRowType.Footer && WebGridView1.ShowFooter)

{

Control ctrl = e.Row.FindControl( "TextBox1");

if (ctrl != null&& ctrl is TextBox)

{

   TextBoxtxt = ( TextBox)ctrl;

  txt.Text = "abc";

 }

}

// 做 Default 操作 (Update 時使用 )

if (e.Row.RowType == DataControlRowType.DataRow)

{

Control ctrl = e.Row.FindControl( "TextBox1");

if (ctrl != null&& ctrl is TextBox)

{

   TextBoxtxt = ( TextBox)ctrl;

  txt.Text = "abc";

 }

}

}

 

可以利用 RowUpdating 的事件來設定更改時欄位的檢核， 如下 :

在 RowUpdating 事件中 , 加入如下代码

protected voidwgvDetail_RowUpdating( objectsender, GridViewUpdateEventArgse)

{

if (e.NewValues[ "UnitPrice"].ToString() == "0") // 此為沒有 Template 的欄位

{

e.Cancel = true;

Page.Response.Write( "<script>alert('UnitPrice 必須不为 0 !');</script>" );

return ;

}

// 如果有設為 TemplateField 者 , 則改用 FindControl

WebRefVal rf = ( WebRefVal)wgvDetail.Rows[e.RowIndex].FindControl( "wrvOrderDetailsProductIDE");

if (rf.BindingValue[0] >= '0'&& rf.BindingValue[0]<= '9')

{

e.Cancel = true;

Page.Response.Write( "<script>alert('Product ID 第一個字母不為數字 !');</script>" );

}

}

 

可以利用 Inserting 的事件來設定新增時欄位的檢核， 如下 :

protected voidWebGridView1_Inserting( objectsender, EventArgse)

{

if (WebGridView1.ShowFooter)

{

   Controlctrl = WebGridView1.FooterRow.FindControl( "TextBox1");

   if(ctrl != null&& ctrl is TextBox)

  {

       TextBox txt = ( TextBox)ctrl;

      if(txt.Text == null|| txt.Text == "")

     {

         Page.Response.Write( "<script>alert(' 请输入不为空的 groupname 的值 !');</script>" );

         WebGridView1.SkipInsert = true; // 这行一定要写

     }

   }

 }

}