CODEWITHSUNDEEP
javascripttags
mere
mere

Reputation: 77

how to disable a label tag in javascript

i need to create five labels using <label> tag in html. then when any one of the label is clicked all the other four labels must be disabled. i have searched through the google but could not find how to disable label tag. is there any way to do that .any suggestion......

<label for="u">username1</label>
<label for="u">username2</label>
<label for="u">username3</label>
<label for="u">username4</label>
<label for="u">username5</label>

Upvotes: 6

Views: 34917

Answers (5)

NotoriousWebmaster
NotoriousWebmaster

Reputation: 3568

Although the disabled property in the label element doesn't work, you can apply it manually in DevTools. Programmatically, though, you can use the setAttribute method:

dateLabelEl.setAttribute('disabled', isDisabled);

And this works as expected.

JavaScript is weird. (Though, technically speaking, this is the DOM API.)

Upvotes: 0

Saket Kumar
Saket Kumar

Reputation: 4835

The correct way to do would be to not only make it look disabled but also to disable any action on click of it. I would use the below code for this purpose:

In HTML

<label  class="disableLabel" for="u">username1 </label>

In CSS

.disableLabel {
    pointer-events: none;
    opacity: 0.5;
}

Upvotes: 5

Ivan Santiago
Ivan Santiago

Reputation: 1782

You can see in the source a whole solution using Javascript and CSS. But if you want labels "look" like disabled you can use CSS this way:

In HTML

<label  class="disabled" for="u">username1 </label>

In CSS

label.disabled { color: #aaa; }

Upvotes: 6

Quentin
Quentin

Reputation: 943579

Before looking at your example, I would have said:

A label can't be disabled. One of the effects it has is to extend the click target of a form control, so you probably want to disable the form control instead.

However, for some reason, all your labels are associated with the same control (the one with id="u"), which suggests that you aren't using <label> correctly. It is possible to have multiple labels for a single control, but it doesn't look like you are doing that.

You should probably take a step back and describe the problem that you think disabling a label will solve.

Upvotes: 6

Sai Kalyan Kumar Akshinthala
Sai Kalyan Kumar Akshinthala

Reputation: 11844

You, cant disable the Labels. Instead u can set the Text property of the label to "" when one label is clicked for the other ones.

Upvotes: 2

Related Questions