首页 > 解决方案 > 单击时 ASP.NET C# WebForms ListView 突出显示项

问题描述

我正在尝试突出显示单击(选定)的 ListView 项目。然而,目前正在发生的是最后一个选定的项目被突出显示。

这是我的 asp.net 代码:

<asp:ListView ID="UsersListView" AutoPostBack="true" runat="server" OnSelectedIndexChanging="UsersListView_SelectedIndexChanging" OnSelectedIndexChanged="UsersListView_SelectedIndexChanged" >
        <LayoutTemplate>         
            <table id="itemPlaceholderContainer" runat="server" border="0" style="">
                <tr>
                    <td id="itemPlaceholder" runat="server">
                    </td>
                </tr>
            </table>     
        </LayoutTemplate>
        <ItemTemplate>
            <tr runat="server">
                <td>
                    <asp:LinkButton ID="UserNameLinkButton" CommandName="Select" runat="server" Text='<%# Container.DataItem %>'/>
                </td>
            </tr>
        </ItemTemplate>
        <SelectedItemTemplate>
            <tr runat="server" style="background-color: #336699;">
                <td>
                    <asp:LinkButton ID="UserNameLinkButton" CommandName="Select" runat="server" Text='<%# Container.DataItem %>' BackgroundColor="#336699" ForeColor="White" />
                </td>
            </tr>
        </SelectedItemTemplate>
    </asp:ListView>

这是我旁边的 C# 代码:

protected void Page_Load(object sender, EventArgs e)
    {
        if(!Page.IsPostBack)
        {
            List<string> users = new List<string>()
        {
            "Gary",
            "Joe",
            "Brian"
        };
            UsersListView.DataSource = users;
            UsersListView.DataBind();
        }
    }

    protected void UsersListView_SelectedIndexChanging(object sender, ListViewSelectEventArgs e)
    {
        UsersListView.SelectedIndex = e.NewSelectedIndex;
    }

    protected void UsersListView_SelectedIndexChanged(object sender, EventArgs e)
    {

    }

谢谢您的帮助。

标签: c#asp.netlistviewwebformshighlighting

解决方案


您必须使用 OnCommand 作为链接按钮或使用 ListViewItemCommand 并将 Item.DisplayIndex 作为参数传递给 linkBut​​ton 属性 CommandArgument,而您正在选择项目,并且在您的情况下,链接按钮不会突出显示,因为您专注于选择而不是 LinkBut​​ton。所以这样做您在服务器端的代码高亮项目按钮。

象素

<asp:ListView ID="UsersListView" AutoPostBack="true" runat="server" OnSelectedIndexChanged="UsersListView_SelectedIndexChanged" OnItemCommand="UsersListView_ItemCommand" OnSelectedIndexChanging="UsersListView_SelectedIndexChanging">
    <LayoutTemplate>         
        <table id="itemPlaceholderContainer" runat="server" border="0" style="">
            <tr>
                <td id="itemPlaceholder" runat="server">
                </td>
            </tr>
        </table>     
    </LayoutTemplate>
    <ItemTemplate>
        <tr runat="server">
            <td>
                <asp:LinkButton ID="UserNameLinkButton" CommandName="Select" OnCommand="UserNameLinkButton_Command" CommandArgument="<%# Container.DisplayIndex %>" runat="server" Text='<%# Container.DataItem %>'/>
            </td>
        </tr>
    </ItemTemplate>
    <SelectedItemTemplate>
        <tr runat="server">
            <td>
                <asp:LinkButton ID="UserNameLinkButton" CommandName="Select"  CommandArgument="<%# Container.DisplayIndex %>" runat="server" Text='<%# Container.DataItem %>' ForeColor="White" />
            </td>
        </tr>
    </SelectedItemTemplate>
</asp:ListView>

cs(代码)

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        List<string> users = new List<string>()
    {
        "Gary",
        "Joe",
        "Brian"
    };
        UsersListView.DataSource = users;
        UsersListView.DataBind();
    }
}
int selectedIndex=0;
protected void UsersListView_ItemCommand(object sender, ListViewCommandEventArgs e)
{

     foreach(var item in UsersListView.Items)
     {
         LinkButton reset=item.FindControl("UserNameLinkButton") as LinkButton;
         reset.BackColor = System.Drawing.Color.White;
         reset.ForeColor = System.Drawing.Color.Blue;
     }
     LinkButton linkButton = (e.Item.FindControl("UserNameLinkButton")) as LinkButton;
     linkButton.BackColor = System.Drawing.ColorTranslator.FromHtml("#336699");
     linkButton.ForeColor = System.Drawing.Color.White;

}
protected void UsersListView_SelectedIndexChanging(object sender, ListViewSelectEventArgs e)
{

}
protected void UsersListView_SelectedIndexChanged(object sender, EventArgs e)
{

}
protected void UserNameLinkButton_Command(object sender, CommandEventArgs e)
{
    //you can also do work here for when one of link button give command.(clicked)
}

经过测试

在此处输入图像描述

在此处输入图像描述


推荐阅读