单击 DataGrid 的任何列以选中整行

• 下载 Datagridrowselection_source.zip - 4.2 KB
• 下载 Datagrid_FullrowSelection_source.zip - 4.2 KB

引言

当需要在 ASP.net 数据网格中实现整行选择时，早期版本的 Visual Studio 中它不会提供直接的选项，就像 ListView 控件一样。我尝试使用 asp:TemplateColumn 代替 asp:BoundColumn 来填充数据网格值，使用了一个小技巧。

背景

示例连接到 SQL Server 中的 Northwind 表。

使用代码

创建具有要显示的列数的数据网格。使用 asp:BoundColumn 分配用于在数据网格中显示的列，并使这些列的可见性为 false。创建与 asp:BoundColumn 数量相同的 asp:TemplateColumn，并为单选按钮创建一个新列。

要创建与 Northwind 表的 SQL 连接字符串，请创建数据集并将其分配给数据网格，如下所示：

//

// Any source code blocks look like this

//

Dim dbCon As New OleDbConnection
dbCon.ConnectionString = "Provider=SQLOLEDB;server=.;uid=sa;pwd=;database=northwind"
dbCon.Open()
Dim ds As New DataSet
Dim ad As OleDbDataAdapter
ad = New OleDbDataAdapter("select employeeid, title, titleofcourtesy + lastname + ' ' + firstname as fullname, birthdate from employees", dbCon)
ad.Fill(ds, "employees")

DG_EmployeeList.DataSource = ds
DG_EmployeeList.DataBind()

在数据网格 ItemDataBound 事件中复制以下代码：

If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
    'To get the Employee id
    Dim nEmployeeId As Integer
    nEmployeeId = e.Item.Cells(1).Text

    'Set onclick event for s.no
    Dim sSerialNumber As HtmlControls.HtmlGenericControl
    sSerialNumber = e.Item.FindControl("lblSNo")
    sSerialNumber.Attributes.Add("onclick", "javascript:onCheckedChangedRadioButton(" & nEmployeeId & ");")

    'Set full name
    Dim sFullName As HtmlControls.HtmlGenericControl
    sFullName = e.Item.FindControl("lblEmployeeName")
    sFullName.InnerHtml = e.Item.Cells(2).Text
    sFullName.Attributes.Add("onclick", "javascript:onCheckedChangedRadioButton(" & nEmployeeId & ");")

    'Set Designation
    Dim sDesignation As HtmlControls.HtmlGenericControl
    sDesignation = e.Item.FindControl("lblDesignation")
    sDesignation.InnerHtml = e.Item.Cells(3).Text
    sDesignation.Attributes.Add("onclick", "javascript:onCheckedChangedRadioButton(" & nEmployeeId & ");")

    'Set last modified date label value
    Dim sDOB As HtmlControls.HtmlGenericControl
    sDOB = e.Item.FindControl("lblDOB")
    sDOB.InnerHtml = e.Item.Cells(4).Text
    sDOB.Attributes.Add("onclick", "javascript:onCheckedChangedRadioButton(" & nEmployeeId & ");")

    'Set for radio button item
    Dim sRadioBtn As HtmlControls.HtmlInputRadioButton
    sRadioBtn = e.Item.FindControl("chkEmployee")
    sRadioBtn.Value = nEmployeeId
    sRadioBtn.Name = "chkEmployee"
End If

正如在设计模式下，我们已经将原始值分配给数据绑定列。这里有一个技巧，我们将所有字段值复制到 Item 模板列中的标签中，并添加客户端 onclick 属性。

数据网格内部创建的行和列在设计中是作为表格结构存在的。单击任何标签时，我们需要使用以下 JavaScript 代码检查它位于哪一行：

//

//Javascript code to choose the selecte row in datagrid

//

function NavigatingDataGrid(oDataGrid, SelNodeValue, selClassName) 
{ 
    oDataGrid = document.getElementById (oDataGrid);
    for(j = 0; j < oDataGrid.childNodes.length; j++) 
    { 
        var tBody = oDataGrid.childNodes(j); 
        for(k=0;k < tBody.childNodes.length-1; k++) 
        { 
            var tr = tBody.childNodes(k); 
            for(l=0; l < tr.childNodes.length-1; l++) 
            { 
                td = tr.childNodes(l);
                for(m=0; m < td.childNodes.length; m++)
                {
                    if ((td.childNodes[m].nodeName == "INPUT") && (td.childNodes[m].type == "radio"))
                    {
                        if (td.childNodes[m].value == SelNodeValue)
                        {
                            tr.className = selClassName;
                        }
                    }
                }
            }
        } 
    } 
}

请参考示例代码以获取更多详细信息。

关注点

数据网格可以通过多种方式进行自定义。我正在努力开发更多选项。