溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

ASP.NET 2.0中怎么為GridView控件添加Checkbox

發布時間:2021-07-16 15:14:13 來源:億速云 閱讀:266 作者:Leah 欄目:開發技術

這期內容當中小編將會給大家帶來有關ASP.NET 2.0中怎么為GridView控件添加Checkbox,文章內容豐富且以專業的角度為大家分析和敘述,閱讀完這篇文章希望大家可以有所收獲。

第1步:添加一個啟用分頁的GridView控件展示產品信息

  在考慮添加checkboxes列前,我們先創建一個展示產品的GridView控件并啟用分頁。在文件夾EnhancedGridView里打開CheckBoxField.aspx頁面并進入設計模式,從工具箱拖一個GridView到頁面,設其ID為Products。下一步,將其綁定到一個名為ProductsDataSource的ObjectDataSource控件。該ObjectDataSource控件使用ProductsBLL類,調用GetProducts()方法返回數據。因為本例的GridView控件是只讀的,在UPDATE, INSERT和DELETE選項卡的下拉列表里選“(None)”。

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖2:創建一個名為ProductsDataSource的ObjectDataSource控件

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖3:設置該ObjectDataSource控件調用GetProducts()方法獲取數據

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖4:在UPDATE, INSERT和DELETE選項卡的下拉列表里選“(None)”。

  完成設置后,Visual Studio會自動為相關數據域(data fields)創建BoundColumns及一個CheckBoxColumn。就像我們在前面的教程做的那樣,將除了 ProductName, CategoryName和UnitPrice外的其它BoundFields刪除,并將相關HeaderText屬性設置為“Product”, “Category”和“Price”。將UnitPrice BoundField格式化為貨幣形式。在智能標簽里選擇“Enable Paging”啟用GridView的分頁功能。

  為了在用戶界面里可以刪除選中的產品,在GridView下面添加一個Button Web控件,設其ID為DeleteSelectedProducts,Text屬性為“Delete Selected Products”。在本例中我們不會直接從數據庫刪除數據,而是顯示一條消息,說明要刪除的是什么產品。因此,在按鈕下面添加一個Label Web控件,設其ID為DeleteResults,清空其Text屬性, 將Visible和EnableViewState屬性都設為false。

做完上述修改后,GridView, ObjectDataSource, Button和Label的聲明代碼應和下面的差不多:

<p>
 <asp:GridView ID="Products" runat="server" AutoGenerateColumns="False"
  DataKeyNames="ProductID" DataSourceID="ProductsDataSource"
  AllowPaging="True" EnableViewState="False">
  <Columns>
   <asp:BoundField DataField="ProductName" HeaderText="Product"
    SortExpression="ProductName" />
   <asp:BoundField DataField="CategoryName" HeaderText="Category"
    ReadOnly="True" SortExpression="CategoryName" />
   <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
    HeaderText="Price" HtmlEncode="False"
    SortExpression="UnitPrice" />
  </Columns>
 </asp:GridView>

 <asp:ObjectDataSource ID="ProductsDataSource" runat="server"
  OldValuesParameterFormatString="original_{0}"
  SelectMethod="GetProducts" TypeName="ProductsBLL">   
 </asp:ObjectDataSource>
</p>
<p>
 <asp:Button ID="DeleteSelectedProducts" runat="server"
  Text="Delete Selected Products" />
</p>
<p>
 <asp:Label ID="DeleteResults" runat="server" EnableViewState="False"
  Visible="False"></asp:Label>
</p>

花幾分鐘在瀏覽器里觀看頁面(見圖5),你可以看到前10個產品的name, category以及price。

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖5:顯示前10個產品的name, category以及price

 第2步:添加一個Checkboxes列

  由于ASP.NET 2.0 包含一個CheckBoxField,我們也許自然會想到用它來為GridView控件添加一個Checkboxes列。然而,并不是那樣回事。因為CheckBoxField是專門設計來與布爾數據域(Boolean data field)打交道。
也就是說,當數據域的值可以用來判斷是否選中了checkbox時,CheckBoxField才派地上用場。CheckBoxField不能正確的包含一列未選中的checkboxes。

  作為替換,我們必須添加一個模板,并在其ItemTemplate模式里添加一個CheckBox Web控件。我們要在GridView控件Products里添加一個模板,并放在最左邊。在GridView的智能標簽里點“編輯模板”,在ItemTemplate模式里添加一個CheckBox Web控件,設其ID為ProductSelector。

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖6:在模板的ItemTemplate模式里添加一個名為ProductSelector的CheckBox Web控件

添加模板和CheckBox Web控件后,每一行記錄將包含一個CheckBox按鈕,如圖7所示:

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖7:每個產品行包含一個CheckBox按鈕

第3步:頁面回傳后確定點擊了哪些Checkboxes按鈕

  現在我們已經創建了一個checkboxes列,但在頁面發生回傳后還不能確定點擊了哪些Checkboxes按鈕,但當點擊“Delete Selected Products”按鈕時,我們需要確定要刪除的是哪些產品,也即點擊了哪些Checkboxes按鈕。

  我們可以運用GridView的Rows屬性訪問其數據行(data rows),編程訪問該記錄行的CheckBox控件,根據其Checked屬性來判斷是否選中了該按鈕。

為名為DeleteSelectedProducts的Button Web控件的Click事件創建一個事件處理器,添加如下代碼:

protected void DeleteSelectedProducts_Click(object sender, EventArgs e)
{
 bool atLeastOneRowDeleted = false;

 // Iterate through the Products.Rows property
 foreach (GridViewRow row in Products.Rows)
 {
  // Access the CheckBox
  CheckBox cb = (CheckBox)row.FindControl("ProductSelector");
  if (cb != null && cb.Checked)
  {
   // Delete row! (Well, not really...)
   atLeastOneRowDeleted = true;

   // First, get the ProductID for the selected row
   int productID =
    Convert.ToInt32(Products.DataKeys[row.RowIndex].Value);

   // "Delete" the row
   DeleteResults.Text += string.Format(
    "This would have deleted ProductID {0}<br />", productID);
  }
 }

 // Show the Label if at least one row was deleted...
 DeleteResults.Visible = atLeastOneRowDeleted;
}

  GridView控件的Rows屬性返回構成GridView數據行的GridViewRow實例集合。而foreach()循環將遍歷集合中的每一個實例。在一個GridViewRow對象中,我們通過使用row.FindControl("controlID")的形式來訪問該行記錄的CheckBox按鈕。如果選擇了該按鈕,從DataKeys集合里獲取與該行記錄相對應的ProductID值。

  在本例,我們僅僅是在Label控件DeleteResults里顯示相關提示信息,而在實際的應用程序中,我們應該調用ProductsBLL類的DeleteProduct(productID)方法。

  添加完上述事件處理器后,點擊“Delete Selected Products”按鈕,將會顯示那些被選中的產品的ProductID值。

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖8:當點擊“Delete Selected Products”時,將列出所選產品的ProductID值

第4步:添加“Check All”和“Uncheck All”按鈕

  如果用戶想刪除當前頁面上的所有產品,則必須點擊每行的checkbox按鈕,稍
顯麻煩。我們可以添加一個“Check All”按鈕,當點擊該按鈕時可以選中頁面上的所有checkbox按鈕。反之,添加一個“Uncheck All”按鈕。

  在頁面上添加2個Button Web控件,放在GridView的上面。設第一個的ID為CheckAll,Text屬性為“Check All”; 設第二個的ID為UncheckAll,Text屬性為“Uncheck All”,如下:

<asp:Button ID="CheckAll" runat="server" Text="Check All" />
&nbsp;
<asp:Button ID="UncheckAll" runat="server" Text="Uncheck All" />

  接著,在后臺代碼類(code-behind class)里創建一個名為ToggleCheckState(checkState)的方法。調用該方法時,其遍歷GridView控件Products的Rows集合,根據傳入的參數checkState對每個CheckBox的Checked屬性賦值。

private void ToggleCheckState(bool checkState)
{
 // Iterate through the Products.Rows property
 foreach (GridViewRow row in Products.Rows)
 {
  // Access the CheckBox
  CheckBox cb = (CheckBox)row.FindControl("ProductSelector");
  if (cb != null)
   cb.Checked = checkState;
 }
}

  然后,為button控件CheckAll和UncheckAll創建Click事件處理器,在CheckAll的Click事件處理器中,僅僅簡單的調用ToggleCheckState(true); 在UncheckAll的事件處理器中,調用ToggleCheckState(false),如下:

protected void CheckAll_Click(object sender, EventArgs e)
{
 ToggleCheckState(true);
}

protected void UncheckAll_Click(object sender, EventArgs e)
{
 ToggleCheckState(false);
}

  當點擊“Check All”按鈕時,引發頁面回傳,并選中所有的checkbox按鈕;點擊“Uncheck All”時,棄選所有的checkbox按鈕。圖9為點擊“Check All”按鈕后的界面。

ASP.NET 2.0中怎么為GridView控件添加Checkbox
圖9:點“Check All”按鈕選擇所有的Checkbox

  注意:如果要全選或棄選checkbox按鈕的話,我們也可以通過點擊標題行(header row)的checkbox來實現,并且在頁面發生回轉后才能生效。完全使用客戶端腳本(client-side script)來執行全選或棄選checkbox按鈕,那將是一種更爽的用戶體驗。

上述就是小編為大家分享的ASP.NET 2.0中怎么為GridView控件添加Checkbox了,如果剛好有類似的疑惑,不妨參照上述分析進行理解。如果想知道更多相關知識,歡迎關注億速云行業資訊頻道。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女