First, the datagrid is named grdUserGroupsI have one datagrid column, wich a TemplateColumn in it. That template column's item has 2 forms, a \check box named chkUserGroup with the name (say the username) displayed, \and a hidden label called lblID with the database uniquie ID of that field.

public sub save(userID as int16)
  Dim item As DataGridItem = Nothing
  Dim userGroupID As Int16 = 0
  Dim checked As Boolean = False

  'First I would delete all records from the database table with this userID
  'to clear all the old records (or the SaveToDatabase could remove duplicates if already in db)

  For i As Int16 = 0 To grdUserGroups.Items.Count - 1
    item = grdUserGroups.Items(i)
    checked = CType(item.FindControl("chkUserGroup"), CheckBox).Checked
    If checked = True Then
      userGroupID = Val(CType(item.FindControl("lblID"), Label).Text.Trim)
      If userID > 0 Then
        SaveToDatabase(userID, userGroupID)
      End If
    End If
  Next
end sub

Instead of being confined to clicking the checkbox name to check/uncheck the box, I want to click anywhere on \that datagrid row to check/uncheck the box. I would use javascript to do so and pass the checkboxes ID. The problem \is that I can't just pass 'chkUserGroup' because it doesn't exist. The datagrid makes up its own unique name \for each checkbox because there are multiple rows. And in my case the grid is in a user control so that UC's \name is also added to the unique checkbox name. So the check box names for my project look likectl03_grdUserGroups_ctl04_chkUserGroupthe ctl03 is the 3rd user control I have on the page, grdUserGroups is the datagrid name, ctl04 is the 4th checkbox \in the datagrid (the 4th row in other words) and chkUserGroup is the name of the checkbox I set in the grid template edit.

Protected Sub grdUserGroups_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles grdUserGroups.ItemDataBound
  Select Case e.Item.ItemType
    Case ListItemType.AlternatingItem, ListItemType.Item
      'If the dg row is clicked anywhere, check/uncheck the box with javascript
      Dim chk As CheckBox = CType(e.Item.FindControl("chkUserGroup"), CheckBox)
      chk.Attributes.Add("onmouseover", "allowCheck = false;")
      chk.Attributes.Add("onmouseout", "allowCheck = true;")
      e.Item.Attributes.Add("onclick", "toggleChkUserGroup('" & chk.ClientID & "');")
  End Select
End Sub

So the chk.ClientID will be like

ctl03_grdUserGroups_ctl01_chkUserGroup
ctl03_grdUserGroups_ctl02_chkUserGroup
ctl03_grdUserGroups_ctl03_chkUserGroup
ctl03_grdUserGroups_ctl04_chkUserGroup

... and so on, one for each datagrid rowNow the javascript is

var allowCheck = false;
function toggleChkUserGroup(clientId) {
  //clientId look like ctl03_grdUserGroups_ctl04_chkUserGroup
  if (allowCheck == true) {
    chk = document.getElementById(clientId);
    if (chk.checked == true) {
      chk.checked = false;
    } else {
      chk.checked = true;
    }
  }
}

Now you can click anywhere on the row to check or uncheck the box and you can retrieve a list of what boxes are \checked.You may have noticed the allowCheck flag. I added this because without it, if you clicked on the \square box itself, nothing would happen. Thats because ASP was checking the box, then my javascript was \unchecking it real fast.

Post Content

Loop datagrid[-][--][++]

Make Each Datagrid row click effect the checkboxes[-][--][++]