melo 唐

大家好,這是我第一篇文章如果寫得不好很抱歉,因為其實這是寫給我自己看的筆記重點

(如果有幫到你那我也很開心),若有ASP.NET WebForm開發同好,歡迎大家可以一起討論共同成長。

謝謝大家囉!

主題:ListView

ListView:ListView和其他樣板最大差異在於,都是以user的template來呈現資料。

重點一:

在連結ListView 和 Datasource小精靈的時候,ListView會自動在幫最後一行加入"新增資料的樣板",

如果不想要可以將其屬性(InsertItemPosition)設置為:None。

重點二:(ListView中的 ItemTemplate 與 AlternatingItemTemplate 樣板之間的差異)

雖說ListView的樣板共有11個,但是個人認為最特殊的就是這兩個樣板了。 原因如下:

如果你只修改ItemTemplate那麼你只會修改到奇數列的顯示資料。

相反的如果你只修改AlternatingItemTemplate那麼你只會修改到偶數列的顯示資料。

給大家看個範例:

<ItemTemplate>
 <span style="background-color: #DCDCDC;color: #000000;">id:
 <asp:Label ID="idLabel" runat="server" Text='<%# Eval("id") %>' />
 <br />
 test_time:
 <asp:Label ID="test_timeLabel" runat="server" Text='<%# Eval("test_time","{0:yyyy/MM/dd}") %>' />
<ItemTemplate>

上面我想顯示資料庫中的test_time,但是我想顯示成短日期(2014/10/26),但原本資料庫中的資料是(2014/10/26 上午12:00)怎改?

答案是修改ItemTemplate 與 AlternatingItemTemplate因為這兩個樣板就是用來顯示ListView的奇數與偶數欄位的資料。

如果今天只修改了ItemTemplate:

那你就只會改到奇數欄位而已喔!

重點三:(ListView中的選取按鈕)

微軟並沒有替ListView加入選取按鈕,但我們怎可能不選取資料!?

所以我們可以自己加! 後置程式碼如下:(記得 ItemTemplate 與 AlternatingItemTemplate都要加喔! )

<ItemTemplate>
<span style="background-color: #DCDCDC;color: #000000;">id:
<asp:Label ID="idLabel" runat="server" Text='<%# Eval("id") %>' />
<br />
test_time:
<asp:Label ID="test_timeLabel" runat="server" Text='<%# Eval("test_time","{0:yyyy/MM/dd}") %>' />
<asp:Button ID="EditButton" runat="server" CommandName="Edit" Text="編輯" />
<asp:Button ID="DeleteButton" runat="server" CommandName="Delete" Text="刪除" />
<asp:Button ID="Button1" runat="server" Text="選取" CommandName="Select" />
<br /><br /></span>
</ItemTemplate>

然後我們可以看到上面紅色程式碼我加入了 CommandName,也就是代表說只要你點了這個按鈕,就會觸發ListView的SelectItemTemplate樣板(內建的),

也就是說會自動變色!(因為ListView的SelectItemTemplate樣板,會自動幫你把選到的那列變色) 畫面如下:

重點四:(自行加入按鈕於ListView樣板中,並且自行處理觸發事件)

依據上述,發現了一個問題我們是可以點選沒錯,但是看完了怎退出? 

所以又是同一招自己加入按鈕!

因為我們選取後觸發的的是ListView的SelectItemTemplate樣板,所以我們要加按鈕在這個樣板。

前端程式碼如下:

<SelectedItemTemplate>
<asp:Button ID="Button3" runat="server" Text="看完了，恢復" CommandName="my_Detail" />
</SelectedItemTemplate>

大家要注意到它的CommandName是設置my_Detail

(重點!)ListView只要有按鈕被按下,就會觸發ItemCommand事件,所以我們要處理此事件就要寫在這裡面。

後置程式碼如下:

protected void ListView1_ItemCommand(object sender, ListViewCommandEventArgs e)
{
  if (e.CommandName == "my_Detail")  //對應上面的CommandName
 {
     ListView1.SelectedIndex = -1;
     //-1代表離開「選取」按鈕的狀態！
  }
}