Question

114

Toggle Checkbox

rated 0 times [ 117] [ 3] / answers: 1 / hits: 34875 / 15 Years ago, tue, march 2, 2010, 12:00:00

I have 4 checkboxes and I wish to toggle them (checked or unchecked) and they should all be the same what ever state they are in. I have this so far:

var toggle_click = false;



function check_them(element){



    if(toggle_click){

        $('#'+element+'_1').attr('checked', true);

        $('#'+element+'_2').attr('checked', true);

        $('#'+element+'_3').attr('checked', true);

        $('#'+element+'_4').attr('checked', true);

    }



    if(!toggle_click){

        $('#'+element+'_1').attr('checked', false);

        $('#'+element+'_2').attr('checked', false);

        $('#'+element+'_3').attr('checked', false);

        $('#'+element+'_4').attr('checked', false);

    }



    if(!toggle_click){ toggle_click = true;   }

    if(toggle_click) { toggle_click = false;  }

}

On page load some of the checkboxes may be ticked or not ticked - but once I click a link and run this function, I want these checkboxes to go all to the same state.

When I try the above, it just doesn't seem to tick the boxes and sometimes it ticks them all and running this function again does nothing. What is going on? I am coffee deprived and confused!

Should be making use of a checkbox group or something?

Thanks all for any help

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

margaritakristinak

Add To Favorites

Follow

Total Points: 502

Total Questions: 127

Total Answers: 98

Location: England

Member since Mon, May 17, 2021

3 Years ago

margaritakristinak questions

1 Parcel.js says to add the type=module attribute to the < script> tag but I've already added it

Thu, Mar 31, 22, 00:00, 2 Years ago

1 Error [ERR_MODULE_NOT_FOUND]: Cannot find package '@babel/plugin-preset-react' imported from

Sun, Feb 20, 22, 00:00, 2 Years ago

1 Why is local storage deleted when I refresh the page?

Tue, May 11, 21, 00:00, 3 Years ago

1 Click event not firing on touchscreen when finger moves a bit

Tue, Oct 29, 19, 00:00, 5 Years ago

1 Nuxt.js: How to use the same page with different URLs and switch the components to be displayed according to the URL

Thu, Mar 28, 19, 00:00, 5 Years ago

View All

answered 15 Years ago felix · Accepted Answer

........

var isChecked = false;



function check_them(element){



    if(isChecked === false) {

        $('#'+element+'_1').attr('checked', true);

        $('#'+element+'_2').attr('checked', true);

        $('#'+element+'_3').attr('checked', true);

        $('#'+element+'_4').attr('checked', true);

        isChecked = true;

    }

    else

    {

        $('#'+element+'_1').attr('checked', false);

        $('#'+element+'_2').attr('checked', false);

        $('#'+element+'_3').attr('checked', false);

        $('#'+element+'_4').attr('checked', false);

        isChecked = false;

    }

}