目錄
    一、DataList Repeater比較" >    一、DataList Repeater比較
    二、DataList中的範本" >    二、DataList中的範本
   三、事件" >   三、事件
    四、編輯DataList中的資料。
" >    四、編輯DataList中的資料。
首頁 後端開發 C#.Net教程 詳解《ASP.NET》資料綁定—DataList

詳解《ASP.NET》資料綁定—DataList

Mar 08, 2017 pm 01:10 PM

     DataList控制項是.NET中的一個控制項。 DataList控制項以表格的形式呈現資料(在屬性產生器中可以編輯),透過該控件,您可以使用不同的佈局來顯示資料記錄(使用模板編輯),例如,將資料記錄排成列或行的形式。您可以對 DataList控制項進行配置,使用戶能夠編輯或刪除表中的記錄(使用EditItemTemplate範本和SelectedItemTemplate範本)。 DataList控制項不使用資料來源控制項的資料修改功能,您必須自行提供此程式碼。

    一、DataList Repeater比較

    1、DataList比Repeater多了兩個範本:SelectedItemTemplate、EditItemTemplate ,支援選擇和編輯功能。

    2、DataList有視覺化的範本編輯和屬性編輯,而Repeater控制項不指定內建版面配置,與DataList相比,資料編輯起來比較麻煩。

    3、DataList中的內容是以表格的形式呈現數據,這樣一來,使數據排列更加美觀,而Repeater自己需要添加表格才行。

    4、DataList將項目明確放在HTML表中,Repeater則不然。

    二、DataList中的範本

    1、ItemTemplate、AlternationgItemTemplate、SeparatorTemplate、HeaderTemplate、FooterTemplate、SelectedItemTemplatelate, EditItemTemplate。

   三、事件

    1、冒泡事件

    在「.NET」框架包含三個支援事件冒泡的標準控制項:Repeater、DataList和DataGrid控制項。這些控制項可以讓你捕捉其子控制項的事件。當子控件產生一個事件時,事件就會「冒泡」傳給包含該子控件的容器控件,並且容器控件可以執行一個子程序來處理該事件。

    DataList控制項支援事件冒泡,可擷取DataList內包含的控制項所產生的事件,並且透過普通的子程式處理這些事件。說到這裡有些人可能不太明白事件冒泡的好處所在,這樣,我們反過來思考:如果沒有事件冒泡,那麼對於DataList內包含的每一個控制項產生的事件都需要定義一個對應的處理函數,如果DataList中包含10000個控制項呢?或更多呢?那我們得寫多少個事件處理程序。所以有了事件冒泡,不管DataList包含多少個控件,我們只需要一個處理程序就可以了。 我的理解就是將程式封裝,再透過繼承的機制決絕問題。

    2、DataList支援的事件:

   EditCommand:由帶有CommandName=”edit」的子控制項產生。

    CancelCommand:由具有CommandName=”cancel」的子控制項產生。
    UpdateCommand:由具有CommandName=”update」的子控制項產生。
    DeleteCommand:由具有CommandName=”delete」的子控制項產生。
    ItemCommand:DataList的預設事件。


    3、事件觸發的過程:有了這五個事件,那麼當我點擊了DataList控制項中的某一個按鈕的時候,該觸發哪一個事件呢?什麼時候才會觸發它們呢?

    在「ASP點NET 」中有三個控制項帶有CommandName屬性,分別是Button、LinkBut​​ton和ImageButton,可以設定它們的CommandName屬性來表示容器控制項內產生的時間類型。例如,如果設定DataList中的一個LinkBut​​ton的CommandName屬性為“update”,那麼點擊此按鈕的時候,將會觸發DataList的UpdateCommand事件,我們可以將相關處理程式碼寫到對應的事件處理程序中去。

   #注意:ItemCommand事件是DataList控制項產生的預設事件,任何DataList控制項中CommandName為delete/cancel/update/edit的按鈕被點擊後,事件ItemCommand先被觸發,然後才是對應的事件。

    四、編輯DataList中的資料。

    1、透過選擇DataList中某一項的主鍵而編輯,使用DataList控制項中的DataKeys集合。

    在選擇DataList中的項目時,通常需要取得與這個項目相關聯的主鍵的值。可以使用DataKeys集合來取得與一個項目想關聯的主鍵的值。在建立了DataKeys集合後,就可以透過傳遞項目的索引值給DataKeys集合來取得DataList中與相關項目關聯的主鍵值。例如,要取得由DataList顯示的第三項的主鍵值,就可以是使用:DataList1.DataKeys[2],如果要在DataList控制項的事件處理函數中發生事件的項的主鍵值,則使用: DataList1.DataKeys[e.Item.ItemIndex]。

    2.編輯DataList中的項目

##    可以使用DataList控制來編輯資料表中的某筆記錄,事實上,在DataList中完成這樣的操作非常的方便,不像在asp中需要在多個頁面中來回切換。 DataList控制項有一個名為EditItemTemplate的模板,在EditItemTemplate中放置表單控件,以便在DataList中編輯特定的項目。當DataList的EditItemIndex屬性的值為DataList某一項的索引的時候,對應的項目會以EditItemTemplate範本顯示;當屬性值為-1時,表示不顯示EditItemTemplate範本。

#    3、選擇DataList中的項目

#    資料綁定到DataList後,DataList中的每一項都有一個索引號,第一項的索引為0,依序往下編號。我們可以利用索引來決定DataList中具體的項。    DataList預設以ItemTemplate或ItemTemplate+AlternatingItemTemplate範本顯示資料項,當DataList的SelectedIndex屬性的值為DataList某一項的索引的時候,對應的項目會以SelectedItemTemplate範本顯示。當屬性值為-1時,表示不顯示SelectedItemTemplate模板。

   四、小結

#   說了這麼多,光說不練是嘴巴式,上面都是一些理論知識,只有自己用到了才能深深地體會到其中的功能,下一篇部落格就是針對DataList的實踐篇,敬請關注! ! ! 

      

以上是詳解《ASP.NET》資料綁定—DataList的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何使用MySQL在SwiftUI中實作資料綁定功能 如何使用MySQL在SwiftUI中實作資料綁定功能 Jul 30, 2023 pm 12:13 PM

如何使用MySQL在SwiftUI中實現資料綁定功能在SwiftUI開發中,透過資料綁定可以實現介面與資料的自動更新,提高使用者體驗。而MySQL作為一款流行的關係型資料庫管理系統,可以儲存和管理大量的資料。本文將介紹如何使用MySQL在SwiftUI中實作資料綁定功能。我們將利用Swift的第三方函式庫MySQLConnector,它提供了連接和查詢MySQL數

Vue文件中的資料綁定函數詳解 Vue文件中的資料綁定函數詳解 Jun 20, 2023 pm 10:15 PM

Vue是一款開放原始碼的JavaScript框架,它主要用於建立使用者介面。 Vue的核心是資料綁定,它提供了一種方便、高效的方式來實現資料和視圖之間的雙向綁定。 Vue的資料綁定機制是透過一些特殊的函數來處理的。這些函數可以幫助我們將模板中的資料自動與JavaScript物件中的對應屬性綁定起來,讓在修改JavaScript物件中的屬性時,模板中的資料也會自動

Vue中如何使用v-once指令實現資料綁定的一次性渲染 Vue中如何使用v-once指令實現資料綁定的一次性渲染 Jun 11, 2023 pm 01:56 PM

Vue是一個流行的前端JavaScript框架,它提供了許多指令來簡化資料綁定的過程,其中一個非常有用的指令是v-once。在這篇文章中,我們將深入探討v-once指令的用法,以及如何在Vue中實現資料綁定的一次性渲染。什麼是v-once指令? v-once是Vue中的一個指令,它的作用是將元素或元件的渲染結果快取起來,以便於在後續的更新中跳過它們的渲染過程。

Vue報錯:無法正確使用v-model進行雙向資料綁定,如何解決? Vue報錯:無法正確使用v-model進行雙向資料綁定,如何解決? Aug 19, 2023 pm 08:46 PM

Vue報錯:無法正確使用v-model進行雙向資料綁定,如何解決?引言:在使用Vue進行開發時,雙向資料綁定是一項非常常見且強大的功能。然而,有時候我們可能會遇到一個問題,就是當我們嘗試使用v-model進行雙向資料綁定時,卻遭遇到了報錯。本文將介紹該問題的原因以及解決方案,並透過程式碼範例來示範如何解決該問題。問題描述:當我們在Vue中嘗試使用v-model

Vue3中的v-model函數詳解:雙向資料綁定的應用 Vue3中的v-model函數詳解:雙向資料綁定的應用 Jun 18, 2023 am 10:25 AM

隨著前端技術的不斷發展,Vue作為一個流行的前端框架,也不斷地更新迭代。其中最新的版本Vue3,引入了許多新特性,使得其在使用方面更加便利和靈活。其中,v-model函數就是Vue3中值得一提的新特性之一。它能夠實現雙向資料綁定,也就是說,在使用v-model函數時,不僅可以方便地實現父子元件之間的通信,同時還可以自動將使用者輸入的資料與元件中的資料綁定起來

Vue開發注意事項:避免常見的錯誤和陷阱 Vue開發注意事項:避免常見的錯誤和陷阱 Nov 23, 2023 am 10:37 AM

Vue開發注意事項:避免常見的錯誤和陷阱引言:Vue.js是一種流行的JavaScript框架,被廣泛用於建立現代化的互動式前端應用程式。儘管Vue.js提供了簡單、靈活和高效的開發方式,但在開發過程中仍然可能遇到一些常見的錯誤和陷阱。本文將介紹一些常見的Vue開發注意事項,幫助開發者避免這些錯誤和陷阱,提高開發效率和程式碼品質。注意事項一:合理使用v-if和

Vue如何實現資料的雙向綁定? Vue如何實現資料的雙向綁定? Jun 27, 2023 pm 04:46 PM

Vue是一種流行的JavaScript框架,它提供了一種方便的方法實現資料的雙向綁定。本文將介紹Vue如何實現資料的雙向綁定。 Vue透過MVVM框架實現雙向綁定,MVVM模式由Model-View-ViewModel組成。 Model表示資料和業務邏輯,View表示UI介面,ViewModel是Model和View之間的橋樑。在Vue中,資料綁定是根據Vue實

如何使用Vue進行表單驗證和資料綁定 如何使用Vue進行表單驗證和資料綁定 Aug 02, 2023 am 10:54 AM

如何使用Vue進行表單驗證和資料綁定引言:隨著前端開發的不斷發展,使用者輸入的表單驗證成為一個重要的環節。 Vue.js作為一個流行的前端框架,提供了一系列的功能來簡化表單驗證和資料綁定的過程。本文將介紹如何使用Vue進行表單驗證和資料綁定,並給出對應的程式碼範例。一、基本的資料綁定:在Vue中,我們可以使用v-model指令來實現資料的雙向綁定。將input元素

See all articles