如何设置GridView的选中行

最新推荐文章于 2025-05-15 13:04:17 发布

转载最新推荐文章于 2025-05-15 13:04:17 发布 · 4.5k 阅读

文章标签：

#function #null #object

ASP.NET 专栏收录该内容

30 篇文章

订阅专栏

本文介绍了一种实现GridView中使用键盘上下键导航并选中不同行的方法，通过JavaScript和.NET后台代码相结合的方式，实现了良好的用户体验。文章详细解释了如何在每行添加特定属性以响应键盘事件和鼠标点击事件，使用户能够便捷地进行行选择。

<script type="text/javascript"> 
        var currentRowId = 0; 
        function SelectRow()
        {
            if (event.keyCode == 40)
                MarkRow(currentRowId+1);
            else if (event.keyCode == 38)
                MarkRow(currentRowId-1);
        } 

        function MarkRow(rowId)
        {
            if (document.getElementById(rowId) == null)
                return; 

            if (document.getElementById(currentRowId) != null )
                document.getElementById(currentRowId).style.backgroundColor = '#ffffff';

            currentRowId = rowId;
            document.getElementById(rowId).style.backgroundColor = '#ff0000';
        } 
    </script>

然后在gridview的rowDataBound中, 添加处理按键的事件处理函数和使用鼠标点击某行时的选中事件.
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Attributes.Add("id", _i.ToString());
        e.Row.Attributes.Add("onKeyDown", "SelectRow();");
        e.Row.Attributes.Add("onClick", "MarkRow(" + _i.ToString() + ");");

        _i++;
    }
}

当点某行时,直接选中,然后移动方向键则切换不同的选中行; 如果直接按方向键,则从第一行开始标识