ASP.NET 中GridView控制項匯總

來源:互聯網
上載者:User

GridView控制項是ASP.NET?
1.x的DataGrid控制項的後繼者。它是一個功能非常強大的通用控制項,可以處理簡單而常見的操作,如分頁、排序、編輯或刪除資料等。以儘可能少的資料實現雙向資料繫結,該控制項與新的資料來源控制項系列緊密結合,而且只要底層的資料來源對象支援,它還可以直接處理資料來源更新。它能定義多個主鍵欄位、新的列類型以及樣式和模板選項。

GridView支援大量屬性,有如下幾大類:行為、可視化設定、樣式、狀態和模板。

GridView的常用行為屬性:

AllowPaging
指示該控制項是否支援分頁;
AllowSorting 指示該控制項是否支援排序;
AutoGenerateColumns
指示是否自動地為資料來源中的每個欄位建立列,預設為True;
AutoGenerateDeleteButton
指示該控制項是否包含一個按鈕列以允許使用者刪除映射到被單擊行的記錄;
AutoGenerateEditButton
指示該控制項是否包含一個按鈕列以允許使用者編輯映射到被單擊行的記錄;
AutoGenerateSelectButton
指示該控制項是否包含一個按鈕列以允許使用者選擇映射到被單擊行的記錄;
DeataMember
指示一個多成員資料中的特定表綁定到該網格。該屬性與DataSource結合使用。如果DataSource是有一個DataSet對象,則該屬性包含要綁定的特定表的名稱;
DataSource
獲得或設定包含用來填充該控制項的值的資料來源對象;
DataSourceID
指示所繫結資料原始檔控制;
EnableSortingAndPagingCallbacks
指示是否使用指令碼回呼函數完成排序和分頁。預設情況下禁用;
RowHeaderColumn
用作欄位標題的列名,該屬性旨在改善可訪問性;
SortExpression 獲得當前排序運算式;
UseAccessibleHeader
規定是否為欄位標題產生<th>標籤(而不能<td>標籤)。

GridView控制項的模板屬性:

EmptyDataTemplate
指示該控制項綁定到一個空的資料來源時要產生的模板內容。如果該屬性和EmptyDataText屬性都設定了,則該屬性優先採用。如果兩個屬性都沒有設定,則把該網格控制項綁定到一個空的資料來源時不產生該網格;
PagerTemplate
指示要為分頁器產生的模板內容。該屬性覆蓋我們可能通過PagerSettings屬性作出的任何設定。

GridView控制項的狀態屬性:

BottomPagerRow
返回表示該網格控制項的底部分頁器的GridViewRow對象;
Columns
獲得一個表示該網格中的列的對象的集合。如果這些列是自動產生的,則該集合總是空的;
DataKeyNames?
獲得一個包含當前顯示項目的主鍵欄位的名稱的數組;
DataKey
獲得一個表示在DataKeyNames中為當前顯示的記錄設定的主鍵欄位的值;
EditIndex
獲得和設定基於0的索引,標識當前以編輯模式產生的行;
FooterRow返回一個表示頁尾的GridViewRow對象;
HeaderRow返回一個表示標題的GridViewRow對象;
PageCount
獲得顯示資料來源的記錄所需的頁面數;
PageIndex
獲得或設定基於0的索引,標識當前顯示的資料頁;
PageSize指示在一個頁面上要顯示的記錄數;
Rows
獲得一個表示該控制項中當前顯示的資料行的GridViewRow對象集合;
SelectedDataKey
返回當前選中的記錄的DataKey對象;
SelectedIndex獲得和設定標識當前選中行的基於0的索引;
SelectedRow返回一個表示當前選中行的GridViewRow對象;
SelectedValue返回DataKey對象中儲存的鍵的顯式值。類似於SelectedDataKey;
TopPagerRow返回一個表示網格的頂部分頁器的GridViewRow對象。

GridView
控制項激發的事件:

PageIndexChanging ,
PageIndexChanged
這兩個事件都是在其中一個分頁器按鈕被單擊時發生。它們分別在網格控制項處理分頁操作之前和之後激發;
RowCancelingEdit
在一個處於編輯模式的行的Cancel按鈕被單擊,但是在該行退出編輯模式之前發生;
RowCommand 單擊一個按鈕時發生;
RowCreated
建立一行時發生;
RowDataBound 一個資料行綁定到資料時發生;
RowDeleting,RowDeleted
這兩個事件都是在一行的Delete按鈕被單擊時發生。它們分別在該網格控制項刪除該行之前和之後激發;
RowEditing
當一行的Edit按鈕被單擊時,但是在該控制項進入編輯模式之前發生;
RowUpdating,RowUpdated這兩個事件都是在一行的Update按鈕被單擊時發生。它們分別在該網格控制項更新該行之前和之後激發;
SelectedIndexChanging,SelectedIndexChanged
這兩個事件都是在一行的Select按鈕被單擊時發生。它們分別在該網格控制項處理選擇操作之前和之後激發;
Sorting,Sorted
這兩個事件都是在對一個列進行排序的超連結被單擊時發生,它們分別在網格控制項處理排序操作之前和之後 激發。

GridView綁定

對列進行配置:如下代碼把一個資料繫結的列添加到網格中:
<asp:GridView ID="GridView1"
runat="server" DataSourceID="SqlDataSource1">
           
<Columns>
                <asp:BoundField DataField="companyname"
HeaderText="產品名稱" />
            </Columns>
           
<EmptyDataTemplate>
            </EmptyDataTemplate>
       
</asp:GridView>

GridView中的繫結資料行,這些欄欄位類都繼承DataControlField:

BoundField
預設的列類型。作為純文字顯示一個欄位的值;
ButtonField作為命令顯示一個欄位的值。我們可以選擇連結按鈕或按鈕開關樣式;
CheckBoxField作為一個複選框顯示一個欄位的值,它通常用來產生布爾值;
CommandField
是ButtonField的增強版本,表示一個特殊的命令,諸如Select、Delete、Insert或Update.該屬性對GridView控制項幾乎沒什麼用;該欄位是為DetailsView控制項定製的;
HyperLinkField作為超連結顯示一個欄位的值。單擊該超連結時,瀏覽器導航到指定的URL;
ImageField
作為一個<img>HTML標籤的Src屬性顯示一個欄位的值,綁定欄位的內容應該是物理映像的URL;
TemplateField
為列中的每一項顯示使用者定義的內容。

GridView列的公用屬性,代表每個列類型實際提供的屬性的一個子集;

AccessibleHeaderText
表示Assistive
Technology裝置的螢幕助讀程式讀取的縮寫文本的文本;
FooterStyle獲得該列的頁尾的樣式對象;
FooterText獲得和設定該列的頁尾的文本;
HeaderImageUrl獲得和設定放在該列的標題中的映像的URL;
HeaderStyle獲得該列的標題的樣式對象;
HeaderText獲得和設定該列的標題的文本;
InsertVisible指示當它的父資料繫結控制項處於插入模式時,該欄位是否可見;
ItemStyle獲得各列的單元的樣式對象;
ShowHeader指示是否產生該列的標題;
SortExpression獲得和設定該列的標題被單擊時用來排序網格的運算式;

綁定欄位
BoundField類表示在一個資料繫結控制項(諸如GridView
或DetailsView)中作為純文字顯示的一個欄位。為了規定要顯示的欄位,把DataField屬性設定為該欄位的名稱,要在頭部或頁尾部分顯示一個標題,請分別設定HeaderText和FooterText屬性;

按鈕欄位
按鈕欄位表示我們希望通過一個伺服器端事件處理的任何操作,當該按鈕被單擊時,頁面回傳並激發一個RowCommand事件。

超連結欄位
超連結列把使用者指向一個不同的URL,該URL可以有選擇地在一個內部架構中顯示出來。
如:
<asp:HyperLinkField
ID="HyperLinkField1" runat="server"
            DataNavigateUrlFields="id"
DataNavigateUrlFormatString="Flower.aspx?id={0}"
           
DataTextField="name" HeaderText="鮮花"
/>
當使用者單擊該按鈕時,瀏覽器用Flower.aspx?id=XXX將鮮花id傳出

CheckBox欄位
       
CheckBoxField列是顯示一個複選框的一個較簡單的繫結資料行.

映像欄位
ImageField列類型表示一個在資料繫結控制項中作為映像顯示的欄位。

模板欄位
有時候我們需要一些特殊格式的綁定欄位,是定製列。這可以通過使用模板得到的結果。
TemplateField列為該網格中的每一行提供一個個人化使用者介面,這完全是由頁面開發人員定義的,我們可以為名產生階段定義模板,包括預設視圖、原地編輯、標題和頁尾。

GridView控制項支援的模板
AlternatingItemTemplate定義交替行的內容和外觀,如果沒有規定模板,則使用ItemTemplate;
EditItemTemplate定義當前正在編輯的行的內容和外觀。該模板包含輸入欄位,而且還可能包含驗證程式;
FooterTemplate定義該行的頁尾的內容和外觀;
HeaderTemplate定義該行的標題的內容和外觀;
ItemTemplate定義該行的預設內容和外觀。

一個模板化視圖可以包含對我們正在建立的應用程式有意義的東西:伺服器控制項、文字和資料繫結運算式。
資料繫結運算式允許我們插入當前資料行中包含的值,然而,並非所有的模板都支援資料繫結運算式。
如下代碼說明了如何為一個產品定義項目模板。該列顯示在現行上,並包括產品的名稱和一些有關產品封裝的資訊。
<asp:TemplateField>
                   
<ItemTemplate>
                        <%# Eval("productName")
%><br/>
                        available in<%#
Eval("quantityperunit") %>
                   
</ItemTemplate>
                </asp:TemplateField>

資料繫結文法

ASP.NET中,有如下兩種資料繫結文法:

1、使用Eval方法
可計算資料繫結控制項的模板中後期綁定日期運算式。Eval方法以資料欄位的名稱作為參數

Eval方法可諸資料繫結控制項的模板中的後期綁定日期運算式。在運行時,Eval方法調用DataBinder對象的Eval方法,同時引用命名容器的當前資料項目。命名容器通常是包含完整記錄的資料繫結控制項的最小組成部分,如GridView控制項中的一行。
Eval方法以資料欄位的名稱作為參數,從事資料來源的目前記錄返回一個包含該欄位值的字串。字串格式參數使用String類的Format方法定義的文法。
Eval是唯讀方法論(定向資料繫結),綁定的內容為不會提交回伺服器。比如使用者名稱,並不想讓使用者做任何修改,可以使用:
<%#
Eval("UserName").ToString.Trim()
%>
Eval還有一個重載的方法,可以實現格式化。比如需要使用者的註冊時間,可以使用:
<%#
Eval("RegTime","{0:dd/MM/yyyy}")
%>
其中0代表對應的PublishDate欄位,而dd/MM/yyyy指明了最終顯示文本的格式,它可能會顯示為17/07/2009.

2、使用Bind方法

Bind方法與Eval方法有一些相似之處,但也存在很大的差異。雖然可以像使用Eval方法一樣使用Bind方法來檢索資料繫結欄位的值,但當資料可以被修改是地,還是要使用Bind方法。
Bind方法通常與輸入控制項一起使用,例如由編輯模式中的GridView行所呈現的TextBox控制項。當資料繫結控制項將這些輸入控制項作為自身呈現的一部分建立時,該方法便可提取輸入值。
Bind方法支援讀/寫功能(雙向資料繫結),該方法常常與輸入控制項(比如TextBox控制項)一起使用,達到可更新資料的目的。比書的標題可以修改,可以設定為:
<%#
Bind("Title") %>

GridView深入

1、高亮顯示
當我們的滑鼠移動到GridView的某一行時,該行加亮顯示,代碼如下 :
protected void
GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
//判斷是否為資料行,即排除表頭和尾
    {
        if (e.Row.RowType ==
DataControlRowType.DataRow)
        {
           
e.Row.Attributes.Add("onmouseover",
"currentcolor=this.style.backgroundColor;this.style.backgroundColor='yellow',this.style.fontWeight='bold'");
           
e.Row.Attributes.Add("onmouseout",
"this.style.backgroundColor=currentcolor,this.style.fontWeight=''");
       
}
    }
如果需要高亮顯示的不是整行,而是某個儲存格,也可以使用該方法,比如我們要高亮顯示價格是"199.00"的儲存格,代碼為:
if
(((flower.Models.Product)e.Row.DataItem).Price.Trim() == "199.00")
       
{
            e.Row.Cells[3].BackColor =
System.Drawing.Color.Yellow;
        }

2、刪除提示
我們在做刪除操作的時候,都會需要一個提示,當使用者確認後才進行刪除操作,對於這種情況,我們一般採用模板列進行處理。代碼如下:
<asp:TemplateField>
               

                    <ItemTemplate>
                       
<asp:LinkButton ID="LinkButton1" runat="server"
OnClientClick="javascript:return confirm('記錄一旦刪除不可恢複,確認要刪除嗎?')"
CausesValidation="false" CommandName="Delete"
Text="刪除"></asp:LinkButton>
                   
</ItemTemplate>
               
               
</asp:TemplateField>

3、GridView結合複選框的全選效果
有時候,我們需要刪除多條記錄,為方便使用者使用,我們不希望每條記錄刪除一次,而希望有一個複選框,可以一次刪除多條記錄,而不是一次次的點刪除確認。這時,可以使用複選框來實現多選的效果。
首先,建立模板列,並在其中放置CheckBox控制項,編寫用戶端指令碼,代碼如下:
<script
language="javascript">
        function
GetAllCheckBox(CheckAll)
        {
            var items =
document.getElementsByTagName("input");
            for(var i = 0;i <
items.length;i++)
            {
                if(items[i].type ==
"checkbox")
                {
                    items[i].checked =
CheckAll.checked;
                }
            }
        }
   
</script>
另外,還需要在“全選”前面的複選框上添加Onclick="GetAllCheckBox(this)"事件,GridView代碼如下:
<asp:TemplateField>
                   
<HeaderTemplate>                       
                       
<input id="cbAll" type="checkbox" onclick="GetAllCheckBox(this)"
/>全選
                    </HeaderTemplate>
                   
<ItemTemplate>
                        <asp:CheckBox ID="CheckBox1"
runat="server" />
                   
</ItemTemplate>
                </asp:TemplateField>

4、固定表頭
固定表頭,是在下拉表格的情況下,表頭跟隨下移,使得表頭相對使用者和瀏覽器而言是在固定位置,可以使使用者隨時看清楚欄位對應的內容。建立浮動樣式代碼如下:

<style
type="text/css">
        .Freezing
        {
       
position:relative;
        table-layout:fixed;
       
top:expression(this.offsetParent.scrollTop);
        z-index:10;
       
}
        .Freezing th
        {
       
text-overflow:ellipsis;
        overflow:hidden;
       
white-space:nowrap;
        padding:2px;
        }
   
</style>
還需將GridView中HeaderSytle的CssClass值設為Freezing

5、顯示隱藏某一列
有時候,結果中的列太多也是一個煩惱,為了適應不同使用者的需求,可能需要使用者自己設定是否顯示某些行。
現在要隱藏ID,編寫代碼如下:
<asp:CheckBox
ID="cbID" runat="server" AutoPostBack="true" Text="隱藏ID"
           
oncheckedchanged="cbID_CheckedChanged" />
事件代碼為:
protected void
cbID_CheckedChanged(object sender, EventArgs e)
    {
       
GridView1.Columns[2].Visible = !GridView1.Columns[2].Visible;
       
Response.Write("ID列現在的顯示隱藏狀態是:"+GridView1.Columns[2].Visible.ToString());
   
}

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.