Controls - Do you include a "select all" checkBox on the top?
Updated by TiagoAraujo 8 years ago. See history
123
Do you have checkbox (on the top) that let users select or unselect all checkboxes underneath it? If you have a list of checkboxes, you are going to frustrate users unless you provide an easy way to select all. The best way to achieve this is to have a checkbox at the top. <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "goodExample", figure: 'Good Example - Hotmail does this', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/HotmailSelectAll.gif" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "default", figure: 'Google have done it a different way to provide multiple methods (All, All Read, All Unread, All Starred, and All Unstarred)', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/GmailSelectAll.gif" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "badExample", figure: 'Bad Example - SQL Auditor - No CheckBox for users to perform a "select all"', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SQLAuditorSelectAll\_Bad.jpg" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "goodExample", figure: 'Good Example - SQL Auditor - CheckBox at the top of the column', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SQLAuditorSelectAll\_good.jpg" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "default", figure: 'Selecting all does this - selects all', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SQLAuditorSelectAll\_All.jpg" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "default", figure: 'Deselecting all does this - selects none', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SQLAuditorSelectAll\_None.jpg" /> <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "default", figure: 'Selecting some should show the Indeterminate check state - aka customized selection', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SQLAuditorSelectAll\_Customize.jpg" /> Private Sub CheckBoxSelectAll\_CheckedChanged(ByVal sender As System.Object, ByVal e As System.EventArgs) \_ Handles CheckBoxSelectAll.CheckedChanged 'Select checkbox in each row For Each sDataGridViewRow As DataGridViewRow In Me.DataGridViewCustomer.Rows sDataGridViewRow.Cells(0).Value = Me.CheckBoxSelectAll.Checked Next End Sub Code: Code for selecting all checkboxes in a windows form <imageEmbed alt="Image" size="large" showBorder={false} figureEmbed={{ preset: "default", figure: 'Select all checkboxes in a web form', shouldDisplay: true }} src="/uploads/rules/controls-do-you-include-a-select-all-checkbox-on-the-top/../../assets/SelectAllCheckBox\_Web.jpg" /> <script type="text/javascript"> function SeleteCheckBox() { for (var n=0; n < document.form1.elements.length; n++) { if (document.form1.elements[n].type == "checkbox" && document.form1.elements[n].name == "gridview") { document.form1.elements[n].checked = document.getElementById("CheckBoxAll").checked; } } } </script> Code: Code for selecting all checkboxes in a web form We have suggestions for Visual Studio .NET about this at [A top CheckBox to "select all" in windows forms](http://www.ssw.com.au/ssw/Standards/BetterSoftwareSuggestions/MSForm.aspx#SelectAllCheckWindows) and [A top CheckBox to "select all" in web forms.](http://www.ssw.com.au/ssw/Standards/BetterSoftwareSuggestions/MSAjax.aspx#SelectAllCheckWeb)