ASP.NET中資料控制元件中的LinkButton控制元件點選時更換顏色

暖楓無敵發表於2011-08-20

在一些網站上常看見如上圖的效果,點選的改變顏色,換一個點選,原先的顏色恢復。


<asp:DataList ID="DataList1" runat="server" RepeatDirection="Horizontal" RepeatColumns="5" SelectedIndex="0">
     <SelectedItemStyle BackColor="Fuchsia" />
     <ItemTemplate>
         <asp:LinkButton ID="LinkButton1" runat="server"  CommandArgument='<%#Eval("area") %>' CommandName="Select"  OnClick="LinkButton1_Click">
                <%#Eval("area") %>
         </asp:LinkButton>  
    </ItemTemplate>
</asp:DataList>

1.設定LinkButton的CommandName屬性為Select,如:

<asp:LinkButton ID="LinkButton1" runat="server" CommandName="Select"  onclick="LinkButton1_Click">
        <%#Eval("area")%>
</asp:LinkButton>



2.在DataList1的SelectedIndexChanged事件中,將點中的行號賦值給ViewState["no"]


  protected void DataList1_SelectedIndexChanged(object sender, EventArgs e)
  {
      ViewState["no"] = DataList1.SelectedIndex.ToString();
      DataList1.DataBind();
  }



3.DataList1的ItemDataBound事件中設定顏色
  protected void DataList1_ItemDataBound(object sender, DataListItemEventArgs e)
  {
        LinkButton linbtn = (LinkButton)e.Item.FindControl("LinkButton1");
       linbtn.ForeColor = System.Drawing.Color.Blue;
       if (ViewState["no"] != null)
       {
            if (e.Item.ItemIndex == Convert.ToInt16(ViewState["no"]))
            linbtn.ForeColor = System.Drawing.Color.Red;
       }
  }



相關文章