ASP.NET列表查看全行選擇

所以我玩弄使用ListView而不是GridView來完成一個複雜的目標。 ListView在很多方面都有所幫助，但是我習慣使用GridView的一些特定代碼，這些代碼不會與ListView無關。ASP.NET列表查看全行選擇

如果非要有一個GridView在我行的一個不錯的鼠標懸停動作，如果我想讓用戶連續任意位置單擊以選中它，我用的是OnRowDataBound事件，做這樣的事情

e.Row.Attributes["onmouseover"] = "this.oldClass=this.className;this.className='hover';"; 
e.Row.Attributes["onmouseout"] = "this.className=this.oldClass;"; 
e.Row.Attributes["onclick"] = Page.ClientScript.GetPostBackClientHyperlink(gdvBuildings, "Select$" + e.Row.RowIndex.ToString());

它與GridViews很好地工作。使用ListView我可以使用OnItemDataBound事件，但似乎沒有任何控件具有要添加的Attributes數組。

有誰知道一個等效的解決方案，允許鼠標懸停和全行點擊一個ListView？

來源

2010-06-03 Justin C

在ListView上，您自己創建行，以便您可以直接在行上添加此功能，如下所示。

<asp:ListView ID="ListView3" runat="server"> 
<ItemTemplate> 
    <tr onmouseover="this.oldClass=this.className;this.className='hover';" onmouseout="this.className=this.oldClass;" onclick='<%# Page.ClientScript.GetPostBackClientHyperlink(gdvBuildings, "Select$" + Container.DataItemIndex.ToString()) %>' > 
    <td> 
     <asp:Label ID="Label7" runat="server" Text='<%# Eval("ClientNumber") %>' /> 
    </td> 
    <td> 
     <asp:Label ID="CityNameLabel" runat="server" Text='<%# Eval("FullName") %>' /> 
    </td> 
    </tr> 
</ItemTemplate> 
<LayoutTemplate> 
    <table id="itemPlaceholderContainer" runat="server" border="0" style=""> 
    <tr id="itemPlaceholder" runat="server"> 
    </tr> 
    </table> 
</LayoutTemplate> 
</asp:ListView>

來源

2010-06-03 21:25:39 alejandrobog

感謝，懸停的偉大工程。我無法點擊工作。在做了一些愚蠢的錯誤之後，我確實得到了它。點擊確實會導致回發，但它不會像Select的CommandType按鈕的按鈕那樣被稱爲ListView的選擇事件。有任何想法嗎？ – 2010-06-04 14:02:35

來源：http://www.codegod.de/WebAppCodeGod/Mouseover-Effect-Hover-for-ASP-NET-GridView-with-CSS-AID476.aspx

我們添加CSS文件到我們的項目，叫做MyGridView一個CSS類僅包含字體設置：

.MyGridView { font-family: Arial; font-size: 12px; }

下THNG我們必須定義一個GridView行的CSS類。這種行在內部由HTML TR標籤表示。因此，我們必須徘徊的時候來定義這樣的類正常的行和列：

.MyGridView tr.row { color: #000000; background-color: #FFFFFF; } 
.MyGridView tr.row:hover { background-image: url('../img/GridViewBG.jpg'); background-repeat: repeat-x; color: #333333; }

對於懸停效果，我們創建了一個小圖像命名GridViewBG.jpg具有大小的2px的X 30像素。當鼠標放在一行上時，它可以看到綠色漸變。

之後，我們將CSS文件添加到ASP.NET窗體。這裏是表格的完整標記代碼：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
<title>Untitled Page</title> 
<link href="css/GridViewStyles.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BorderWidth="0px" CellPadding="8" CssClass="MyGridView" Width="400px" OnRowCreated="GridView1_RowCreated"> 
    <Columns> 
    <asp:BoundField DataField="Name" HeaderText="Name"> 
    <HeaderStyle HorizontalAlign="Left" /> 
    </asp:BoundField> 
    <asp:BoundField DataField="Firstname" HeaderText="Firstname"> 
    <HeaderStyle HorizontalAlign="Left" /> 
    </asp:BoundField> 
    </Columns> 
    <HeaderStyle BackColor="Green" Font-Bold="True" ForeColor="White" /> 
    </asp:GridView> 
</div> 
</form> 
</body> 
</html>

正如您所看到的，我們定義了兩列以顯示個人數據。 GridView的CSS類由屬性CssClass="MyGridView"分配。但是分配這個是不夠的，因爲GridView行的類也需要分配。我們使用GridView的事件RowCreated此任務：

protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e) 
{ 
    // Set the CSS-class "row" for normal grid-rows 
    if (e.Row.RowType == DataControlRowType.DataRow) 
     e.Row.CssClass = "row"; 
}

（3）顯示數據

現在唯一剩下要做的是填補了GridView的一些樣本數據，讓我們可以看到在行動中的鼠標懸停效果。這是我們DataSourceProvider類爲我們生成一些數據：

public class DataSourceProvider 
{ 
    public static DataTable GetPersons() 
    { 
     DataTable result = new DataTable(); 
     result.Columns.Add("Name"); 
     result.Columns.Add("Firstname"); 
     AddPerson(result, "Matthias", "Pieroth"); 
     AddPerson(result, "Mark", "Twain"); 
     AddPerson(result, "Charles", "Bukowski"); 
     AddPerson(result, "Francois", "Villon"); 
     return result; 
    } 

    private static void AddPerson(DataTable table, string firstName, string name) 
    { 
     DataRow row = table.NewRow(); 
     row["Name"] = name; 
     row["Firstname"] = firstName; 
     table.Rows.Add(row); 
    } 
}

這些數據的結合是在窗體的Page_Load中事件做

protected void Page_Load(object sender, EventArgs e) 
{ 
    GridView1.DataSource = DataSourceProvider.GetPersons(); 
    GridView1.DataBind(); 
}

來源

2010-06-04 05:44:27 pjb

ASP.NET列表查看全行選擇

回答

相關問題