patternMinor

Making at least one checkbox required

Submitted by: @import:stackexchange-codereview·Mar 10, 2026·

Viewed 0 times

checkboxoneleastmakingrequired

Problem

This code controls whether the user has checked at least one checkbox field before saving the record. If the user has failed to do so the code throws an error message and cancels the operation.

Is there a better/more efficient way to write it?

function BusComp_PreWriteRecord ()
{
    try
    {
        var sSMS =          this.GetFieldValue("R SMS");
        var sEmail =        this.GetFieldValue("R Email");
        var sChannel1 =     this.GetFieldValue("R Channel 1");
        var sChannel2 =     this.GetFieldValue("R Channel 2");
        var sChannel3 =     this.GetFieldValue("R Channel 3");

        //R 17.12.14 ES: Added to make channel choice fields required if none are filled in
        if ((sSMS != "Y") && (sEmail != "Y") && (sChannel1 != "Y") && (sChannel2 != "Y") && (sChannel3 != "Y"))
        {
            TheApplication().RaiseErrorText("Please check at least one box");
        }
    }
    catch(e)
    {
        throw e;
    }
}

Solution

I'd probably verify the correct amount of checkboxes by iterating over them when verifying. This can get tricky in case your layout is complex, but you should usually be able to find a solution to this.

Since I liked the initial idea (I always try to avoid doing such checks or just do them server side), here's a fiddle I came up with. Just keep in mind that this code is barely optimized, complete or clean. It's just some quick example put together.

This works pretty straightforward and without any source code modifications in case anyone adds more checkboxes. You could even just modify the plain HTML template and everything would work again.

Here's the magic:

-
All check box groups are grouped inside some HTML tag/container. In my case it's a `. These containers are marked with the class checkgroup

.


    


- 
Once verifying, I first determine all such containers in the current document.

var groups = document.getElementsByClassName('checkgroup');


- 
Then I try to read custom attributes to get custom limits as well as a possible error message (stored in

minimum, maximum, and message`).

// Get the limits
if (group.hasAttribute('minchecked'))
    minimum = parseInt(group.getAttribute('minchecked'));
if (group.hasAttribute('maxchecked'))
    maximum = parseInt(group.getAttribute('maxchecked'));
// Get the actual error message
if (group.hasAttribute('errchecked'))
    message = group.getAttribute('errchecked');

-
I then iterate over all checkboxes included in the current group and count the number of checked instances.

var checkboxes = group.getElementsByTagName('input');
for (var j = 0; j < checkboxes.length; ++j) {
    // Here I should check whether that's indeed a checkbox...
    if (checkboxes[j].checked)
        ++ticked;
}

-
Once this is done, there's a simple comparison on the limits and an error message is shown just in case.

// Show an error message and highlight the background
if (ticked  maximum) {
    group.style.backgroundColor = '#fcc';
    alert(message);
    group.style.backgroundColor = '';
}

Code Snippets

<div class="checkgroup">
    <!-- Other content and checkboxes -->
</div>

var groups = document.getElementsByClassName('checkgroup');

// Get the limits
if (group.hasAttribute('minchecked'))
    minimum = parseInt(group.getAttribute('minchecked'));
if (group.hasAttribute('maxchecked'))
    maximum = parseInt(group.getAttribute('maxchecked'));
// Get the actual error message
if (group.hasAttribute('errchecked'))
    message = group.getAttribute('errchecked');

var checkboxes = group.getElementsByTagName('input');
for (var j = 0; j < checkboxes.length; ++j) {
    // Here I should check whether that's indeed a checkbox...
    if (checkboxes[j].checked)
        ++ticked;
}

// Show an error message and highlight the background
if (ticked < minimum || ticked > maximum) {
    group.style.backgroundColor = '#fcc';
    alert(message);
    group.style.backgroundColor = '';
}

Context

StackExchange Code Review Q#73896, answer score: 3

Revisions (0)

No revisions yet.