Javascript C GridView从动态创建的数据表中实现可点击单元格

我已经试着做了一段时间了，我已经不知所措了。我有一个带有GridView控件的web表单。数据源是一个动态创建的数据表，如果可能的话，我希望不使用模板字段。我的目标是有4个复选框列，用户可以单击这些列来更改值。我刚刚将4列数据类型设为bool，以便它们自动显示为复选框。我知道如何在javascript的帮助下选择一行，但我无法检测单击了哪个列

显示当前如何选择行的相关代码：

function getSelectedRow(row) 
{
    jQuery(row).children(":first").children(":first")[0].click();
}

代码隐藏：

protected void gvReviewOrder_OnRowDataBound(object sender,  GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        string onClick = "javascript: getSelectedRow(this);";
        e.Row.Attributes["onclick"] = onClick;
        e.Row.Style["cursor"] = "pointer";
    }
}

我最近尝试的是从以下线程使用JQuery：

我没有使用警报，而是尝试将单击的列索引更新为隐藏字段，因此我当前的Javascript函数如下所示：

$("td").click(function () 
{
    var colIndex = $(this).parent().children().index($(this));
    $("#hfColumnId").val(colIndex);
});

因此，假设我的隐藏字段hfColumnId应该在单击单元格时更新，但事实并非如此。我是否需要在OnRowDataBound事件上添加代码以首先添加click事件

正如你可能猜到的，当涉及到网络表单时，我仍然在学习，而我现在正忙得不可开交。任何帮助都将不胜感激

因此，简而言之，当从GridView控件通过jquery单击单元格时，有没有方法返回列索引

提前谢谢

编辑 我从去年的一个解决方案中发现了这个线程，但他们建议将EnableEventValidation设置为false，我知道这是不推荐的。所以，如果我能想出如何实现这种方式而不设为假，这可能是一个潜在的解决方案

---

可能的解决方案如所述：

清单1。将onClick属性添加到由ASP.NET GridView动态呈现的表中

以及相应的示例Javascript函数，用于在click事件上对动态呈现的表行执行一些自定义格式，基本上实现了click事件处理程序：

清单2。Javascript函数来格式化表行onClick

等等

---

希望这能有所帮助。

谢谢Alex的回复，但除非我把这段代码看错了，否则我认为它对我正在尝试的工作不起作用。我的网格视图有10列。最后4列具有复选框，可根据基础数据的内容进行选中或取消选中。假设用户在第一个复选框列的第二行单击，这将是列索引6。我需要将该行号和列号返回给我，以便我可以修改底层数据表。我可以使用OnSelectedIndexChanged方法获取单击的行，但返回列clickedYou's welcome时遇到问题。这只是核心客户端GridView/CheckBox Javascript的一个示例演示，也可以是jQuery编码技术，提供高响应性，无需服务器往返。除此之外，根据需要，还可以对提交事件执行进一步的服务器端处理，并根据您的特定需求进行定制。请注意，如果我只想返回单击的列，javascript或JQuery函数会是什么样子？理想情况下，我希望当用户在该gridview中单击时，我希望将列索引保存在某个位置（可能在我的隐藏字段中），以便在我的代码中，我可以相应地更改我的DataTable信息。谢谢你迄今为止的帮助。我的主要技能是使用c，但Jquery部分是我遇到的大部分问题。ASP.NET GridView控件呈现为HTML表，因此单元格将由行和列索引处理，例如row.cells[0]。只要您可以从表行截取click事件，就可以通过复选框的checked属性获取复选框的状态，并在客户端使用Javascript（如本例所示）或在服务器端进一步处理该数据。如果您有更多问题，请单独发布，因为此讨论主题越来越长。顺致敬意，

protected void GridView1_RowDataBound(Object sender, GridViewRowEventArgs e){
    if (e.Row.RowType == DataControlRowType.DataRow){
        // javascript function to call on row-click event
        e.Row.Attributes.Add("onClick", "javascript:void SelectRow(this);");
    }
}

<script type="text/javascript">
// format current row
function SelectRow(row) {
 var _selectColor = "#303030";
 var _normalColor = "#909090";
 var _selectFontSize = "3em";
 var _normalFontSize = "2em";
 // get all data rows - siblings to current
 var _rows = row.parentNode.childNodes;
 // deselect all data rows
 try {
     for (i = 0; i < _rows.length; i++) {
         var _firstCell = _rows[i].getElementsByTagName("td")[0];
         _firstCell.style.color = _normalColor;
         _firstCell.style.fontSize = _normalFontSize;
         _firstCell.style.fontWeight = "normal";
     }
 }
 catch (e) { }
 // select current row (formatting applied to first cell)
 var _selectedRowFirstCell = row.getElementsByTagName("td")[0];
 _selectedRowFirstCell.style.color = _selectColor;
 _selectedRowFirstCell.style.fontSize = _selectFontSize;
 _selectedRowFirstCell.style.fontWeight = "bold";
}
</script>

// ** table row click event **
function row_OnClick(tblId) {
    try {
        var rows = document.getElementById(tblId).rows;
        for (i = 0; i < rows.length; i++) {
            var _row = rows[i];
            _row.onclick = null;
            _row.onclick = function () {
                return function () {selectRow(this);};
            }(_row);
        }
    }
    catch (err) { }
}

row.cells[0].firstChild.checked