Question

28

How to disable checkbox with jquery?

rated 0 times [ 32] [ 4] / answers: 1 / hits: 55694 / 9 Years ago, sun, june 14, 2015, 12:00:00

I searched more time with it but it's not work, I want to checkbox is disabled, user not check and can check it if some condition. Ok, now, I tried disabled them. I use jquery 2.1.3

 <input type=checkbox class=checkbox1 id=chk name=check[] value=U01 />Banana

 <input type=checkbox class=checkbox1 id=chk name=check[] value=U02 />Orange

 <input type=checkbox class=checkbox1 id=chk name=check[] value=U03 />Apple

 <input type=checkbox class=checkbox1 id=chk name=check[] value=U04 />Candy

$(window).load(function () {

    $('#chk').prop('disabled', true);

});

Answers

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

tayla

Add To Favorites

Follow

Total Points: 681

Total Questions: 102

Total Answers: 108

Location: Marshall Islands

Member since Tue, Sep 21, 2021

3 Years ago

tayla questions

1 Problem embedding tiktok video into angular 7

Fri, Mar 5, 21, 00:00, 3 Years ago

1 Lodash - How to merge two arrays of objects based on key?

Wed, Oct 28, 20, 00:00, 4 Years ago

1 Horizontal scroll bar is appearing after using slick slider in the webpage

Wed, Oct 21, 20, 00:00, 4 Years ago

1 Jest: `querySelector` returns null in test of a ReactJS component

Sat, Jul 4, 20, 00:00, 4 Years ago

1 setTimeout with Promises

Thu, Apr 9, 20, 00:00, 4 Years ago

View All

answered 9 Years ago earllutherf · Accepted Answer

id should be unique. You cannot have four checkboxes with the same id.

You can try other selectors to select the whole range of checkboxes, like .checkbox1 (by class), input[type=checkbox] (by tag/attribute). Once you've fixed the ids, you could even try #chk1, #chk2, #chk3, #chk4.

The snippet below uses the classname 'chk' instead of the id 'chk'. Also, it uses attr to set the attribute although it did work for me using prop as well.

$(window).load(function() {

  $('.chk').attr('disabled', true);

});

<script src=https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js></script>

<input type=checkbox class=chk name=check[] value=U01 />Banana

<input type=checkbox class=chk name=check[] value=U02 />Orange

<input type=checkbox class=chk name=check[] value=U03 />Apple

<input type=checkbox class=chk name=check[] value=U04 />Candy