I'm facing an issue with my GridView where I have information displayed in each row. When a user clicks on a row, more related information is supposed to be shown in a separate DIV. However, I am unable to target the specific row when trying to change or add CSS classes upon click. How can I ensure that the JavaScript onclick event targets the correct row?
Below is a simplified version of the code:
protected void vd_gv_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onclick", "showTest(this)");
}
}
And here is the JS function called onclick:
<script type="text/javascript">
function showTest(test) {
var row = document.getElementById(test.id);
var currentClass = row.className;
row.className += "testClass";
}
</script>
Upon debugging, the following error message appears:
Empty string passed to getElementById().