Clearing a CheckBox after changing a DropDownList's selection

By John Bowen, 27 April, 2008

I had an ASP.NET form, where I wanted a quick Javascript function to un-check a CheckBox if the user changed the selection in a related DropDownList. Restated, I wanted any change in the DropDownList's selected item to clear the CheckBox. The user could then (if needed) re-check the CheckBox once they're done selecting from the DropDownList.

Adding the javascript onchange() event to the DropDownList's attributes from the ASP.NET class file turned out to be the easy part. In Page_Load():

this.ddTeams.Attributes.Add("onChange", "uncheckbox()")

The harder part for me was finding a simple example for a javascript function that would actually work inside the 'uncheckbox' function. Most of the examples I ran across look very good for selecting all the CheckBoxes in a group and checking all/un-checking all, but I didn't have a collection of CheckBoxes, just one.

Here's what I eventually came up with:

function uncheckbox() {
document.getElementById('chkIsTeamCaptain').checked = false;
}

Now, whenever the web user makes a change in the ddTeams DropDownList, the chkIsTeamCaptain CheckBox is cleared.

Filtered HTML

  • Web page addresses and email addresses turn into links automatically.
  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.