Make check box variables Mandatory depending on select box choices

satya30
Tera Contributor

Hi All,

Thank you for taking your time and helping me out.

Please help me out, I am working for long time on below requirement.

I have a requirement where 

 

We have 6 check box variables(next to each other like options variable):

If choice 1 is selected then all 6 checkboxes should be available for checking but out of particular 3 checkbox variables one should definitely be selected

If choice 2 is selected then all 6 checkboxes should be available out of which 3 should definitely be selected

If choice 3 is selected then 3 check box variables should definitely be selected and out of other 3 check boxes any of one should be selected

ie. For example I have a select box variable SBV with choices A, B, C and the Checkboxes D1, D2, D3, D4, D5, D6

 

If A is selected we need 1 of (D1, D2, and D3) to be required

If B is selected, we need ALL the (D4, D5, D6) and add a note that says “If B is selected all three choices should definitely be selected”

If Cis selected we need  all the (D4, D5, D6) to be required  and one of (D1, D2, and D3) is required.

 

 

Below is the code that I tried working on:

 

Onchange of variable SBV

 

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
       
    g_form.clearMessages();
    g_form.setMandatory('D1’, false);
    g_form.setMandatory(D2, false);
    g_form.setMandatory(D3, false);
    g_form.setMandatory(D4, false);
    g_form.setMandatory(D5, false);
    g_form.setMandatory(D6, false);

    }
     
    if (newValue != oldValue){
    g_form.clearMessages();
    g_form.setMandatory('D1’, false);
    g_form.setMandatory(D2, false);
    g_form.setMandatory(D3, false);
    g_form.setMandatory(D4, false);
    g_form.setMandatory(D5, false);
    g_form.setMandatory(D6, false);


g_form.setVisible('D1’, false);
g_form.setVisible(D2, false);
g_form.setVisible(D3, false);
g_form.setVisible(D4, false);
g_form.setVisible(D5, false);
g_form.setVisible(D6, false);
   
    // Check the selection in the "SBV" field
    switch (newValue) {
        case 'A':
            // Make one of the mobility amenities required
            g_form.clearMessages();
            g_form.setVisible('D1’, true);
            g_form.setVisible(D2, true);
            g_form.setVisible(D3,, true);
            g_form.setVisible(D4,, false);
            g_form.setVisible(D5, false);
            g_form.setVisible(D6, false);

            g_form.setMandatory('D1’, true);
            g_form.setMandatory(D2, true);
            g_form.setMandatory(D3,, true);

           
            // Show hearing amenities if any mobility amenity is selected
            if (g_form.getValue('D1’) == 'true' ||
                g_form.getValue(D2) == 'true' ||
                g_form.getValue(D3) == 'true') {
                   
                g_form.setVisible('D4’, true);
                g_form.setVisible(D5, true);
                g_form.setVisible(D6, true);
            }
            break;

        case 'B':
            g_form.clearMessages();
            g_form.setVisible('D1’, true);
            g_form.setVisible(D2, true);
            g_form.setVisible(D3, true);
            g_form.setVisible(D4, true);
            g_form.setVisible(D5, true);
            g_form.setVisible(D6, true);

            // Make all hearing amenities required
            g_form.setMandatory(D4, true);
            g_form.setMandatory(D5, true);
            g_form.setMandatory(D6, true);

            // Set the hearing amenities to true (check them)
            g_form.setValue(D4, true);  
            g_form.setValue(D5, true);  
            g_form.setValue(D6, true);  

            break;

        case 'C':
            g_form.clearMessages();
            g_form.setVisible('D1’, true);
            g_form.setVisible(D2, true);
            g_form.setVisible(D3, true);
            g_form.setVisible(D4, true);
            g_form.setVisible(D5, true);
            g_form.setVisible(D6, true);

            // Make all hearing amenities required
            g_form.setMandatory(D4, true);
            g_form.setMandatory(D5, true);
            g_form.setMandatory(D6, true);

            // Set the hearing amenities to true (check them)
            g_form.setValue(D4, true);  
            g_form.setValue(D5, true);  
            g_form.setValue(D6, true);  

            // Make one mobility amenity required
            g_form.setMandatory('D1’, true);
            g_form.setMandatory(D2, true);
            g_form.setMandatory(D3, true);

            break;

        default:
            break;
    }
}
}

Please help me. Thanks in advance.

9 REPLIES 9

Rajesh Chopade1
Mega Sage

Hi @satya30 

 

There are some incorrect quotation marks used in the code. You should replace these with standard single or double quotes.

There are some extra commas in your script, particularly in the g_form.setVisible and g_form.setMandatory lines. These should be removed.

 

Try bellow revised code:

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        // Reset visibility and mandatory fields when the form is cleared
        g_form.clearMessages();
        g_form.setMandatory('D1', false);
        g_form.setMandatory('D2', false);
        g_form.setMandatory('D3', false);
        g_form.setMandatory('D4', false);
        g_form.setMandatory('D5', false);
        g_form.setMandatory('D6', false);

        g_form.setVisible('D1', false);
        g_form.setVisible('D2', false);
        g_form.setVisible('D3', false);
        g_form.setVisible('D4', false);
        g_form.setVisible('D5', false);
        g_form.setVisible('D6', false);
    }

    // Check the selection in the "SBV" field and apply the correct logic
    switch (newValue) {
        case 'A':
            g_form.clearMessages();
            // Make checkboxes D1, D2, D3 visible and mandatory, but allow one to be selected
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setVisible('D4', false);
            g_form.setVisible('D5', false);
            g_form.setVisible('D6', false);

            g_form.setMandatory('D1', true);
            g_form.setMandatory('D2', true);
            g_form.setMandatory('D3', true);

            // Ensure that one of D1, D2, or D3 is selected
            if (g_form.getValue('D1') == 'false' && g_form.getValue('D2') == 'false' && g_form.getValue('D3') == 'false') {
                g_form.showFieldMsg('D1', 'One of D1, D2, or D3 must be selected', 'error');
            }
            break;

        case 'B':
            g_form.clearMessages();
            // Make all checkboxes visible and mandatory
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setVisible('D4', true);
            g_form.setVisible('D5', true);
            g_form.setVisible('D6', true);

            g_form.setMandatory('D4', true);
            g_form.setMandatory('D5', true);
            g_form.setMandatory('D6', true);

            // Automatically check D4, D5, and D6 as they are mandatory
            g_form.setValue('D4', true);
            g_form.setValue('D5', true);
            g_form.setValue('D6', true);

            break;

        case 'C':
            g_form.clearMessages();
            // Make all checkboxes visible and D4, D5, D6 mandatory
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setVisible('D4', true);
            g_form.setVisible('D5', true);
            g_form.setVisible('D6', true);

            g_form.setMandatory('D4', true);
            g_form.setMandatory('D5', true);
            g_form.setMandatory('D6', true);

            // Make one of D1, D2, or D3 required
            g_form.setMandatory('D1', true);
            g_form.setMandatory('D2', true);
            g_form.setMandatory('D3', true);

            // Ensure that one of D1, D2, or D3 is selected
            if (g_form.getValue('D1') == 'false' && g_form.getValue('D2') == 'false' && g_form.getValue('D3') == 'false') {
                g_form.showFieldMsg('D1', 'One of D1, D2, or D3 must be selected', 'error');
            }

            // Automatically check D4, D5, and D6
            g_form.setValue('D4', true);
            g_form.setValue('D5', true);
            g_form.setValue('D6', true);

            break;

        default:
            break;
    }
}

 

I hope my answer helps you to resolve your issue, if yes please mark my answer helpful and correct.

thank you

Rajesh

Thank you Rajesh for your response,

Here in this,

CASE A: after selecting one of D1, D2, D3 then D4, D5, D6 should be visisble and this is not happening

CASE B: when selecting the CASE B along with the 3 options pre selected, previously selected choice is not clearing 

CASE C: when selecting the CASE C along with the 3 options pre selected, previously selected choice is not clearing and the form is getting submitted even though is we had not selected any one of the three checkboxes.

One more important thing is "previously selected values ar enot clearing while changing the select box variable choices.

Please look into these issues and help me. 

Thank you.

satya30
Tera Contributor

The show field messages are also appearing 3 times because I tried changing choices and this show field message is not going:

satya30_0-1737623290732.png

 

Hi @satya30 

 

Try bellow revised code once, it should work as expected:

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || !newValue) {
        return;
    }

    // Clear all previous messages (this is the key to preventing multiple messages)
    g_form.clearMessages();

    // Reset checkbox values and visibility for all checkboxes before applying new logic
    g_form.setValue('D1', false);
    g_form.setValue('D2', false);
    g_form.setValue('D3', false);
    g_form.setValue('D4', false);
    g_form.setValue('D5', false);
    g_form.setValue('D6', false);

    // Reset visibility and mandatory status of all checkboxes
    g_form.setVisible('D1', false);
    g_form.setVisible('D2', false);
    g_form.setVisible('D3', false);
    g_form.setVisible('D4', false);
    g_form.setVisible('D5', false);
    g_form.setVisible('D6', false);

    g_form.setMandatory('D1', false);
    g_form.setMandatory('D2', false);
    g_form.setMandatory('D3', false);
    g_form.setMandatory('D4', false);
    g_form.setMandatory('D5', false);
    g_form.setMandatory('D6', false);

    // Now, handle each case based on the selected value of SBV
    switch (newValue) {
        case 'A':
            // Show D1, D2, D3 and make them mandatory
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setMandatory('D1', true);
            g_form.setMandatory('D2', true);
            g_form.setMandatory('D3', true);

            // Ensure that D4, D5, D6 are only visible if one of D1, D2, or D3 is selected
            if (g_form.getValue('D1') == 'true' || g_form.getValue('D2') == 'true' || g_form.getValue('D3') == 'true') {
                g_form.setVisible('D4', true);
                g_form.setVisible('D5', true);
                g_form.setVisible('D6', true);
            }
            break;

        case 'B':
            // Show D4, D5, D6 and make them mandatory
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setVisible('D4', true);
            g_form.setVisible('D5', true);
            g_form.setVisible('D6', true);

            g_form.setMandatory('D4', true);
            g_form.setMandatory('D5', true);
            g_form.setMandatory('D6', true);

            // Automatically check D4, D5, and D6 as required
            g_form.setValue('D4', true);  
            g_form.setValue('D5', true);  
            g_form.setValue('D6', true);  

            break;

        case 'C':
            // Show D1, D2, D3, D4, D5, D6 and make D4, D5, D6 mandatory
            g_form.setVisible('D1', true);
            g_form.setVisible('D2', true);
            g_form.setVisible('D3', true);
            g_form.setVisible('D4', true);
            g_form.setVisible('D5', true);
            g_form.setVisible('D6', true);

            g_form.setMandatory('D4', true);
            g_form.setMandatory('D5', true);
            g_form.setMandatory('D6', true);

            // Check if one of D1, D2, or D3 is selected
            if (g_form.getValue('D1') == 'false' && g_form.getValue('D2') == 'false' && g_form.getValue('D3') == 'false') {
                g_form.showFieldMsg('D1', 'One of D1, D2, or D3 must be selected', 'error');
            }

            // Automatically check D4, D5, and D6 as required
            g_form.setValue('D4', true);  
            g_form.setValue('D5', true);  
            g_form.setValue('D6', true);  
            break;

        default:
            break;
    }
}

Functionality of showing variables is also not working and the same issues as before.

item also gets submitted in case c without checking one of those mandatory varaibles and in All the variables are being shown all the time