Devarshi Goswami
Devarshi Goswami

Reputation: 1225

toggle value of disabled attribute when JavaScript enabled

I have an input tag on my website that uses javascript for autocomplete ...I want <input> tags' disabled attribute as true when my users don't have javascript enabled on their systems. but when Javascript is enabled I want the value of disabled=false. how do I go about doing that?

what I've done so far:

<input name="xyz" class="xyzautocomplete" type="text" id="name" value="enter name" disabled="true">

will using

document.getElementById("name").disabled = false;

inside same <input> tag as script="" work for both cases??

IE,

 <input name="xyz" script="document.getElementById("name").disabled = false;" class="xyzautocomplete" type="text" id="0" value="enter name" disabled="True">

IF NOT, how would I do it??

Upvotes: 0

Views: 82

Answers (3)

Mr Lister
Mr Lister

Reputation: 46559

The other answers are correct with regards to the inline JavaScript. There is no script attribute, and onload isn't defined for inputs, so your script will need to be in a <script> element following the input.

However, what none of the existing answers mention is that disabled is a boolean attribute, that is, its presence or absence determines whether the input is disabled or not. Its value does not matter.

So setting the attribute to a value in JavaScript does not work. The attribute would still be there, just with a different value!
What you need to do is remove the attribute altogether.

document.getElementById("name").removeAttribute('disabled');
<input name="xyz" class="xyzautocomplete" type="text" id="name" value="enter name" disabled="true">

Upvotes: 1

Alok Mali
Alok Mali

Reputation: 2881

If the javascript is disabled then none of the javascript syntaxes will work.

You have to do it with Tag

Please try with below solution -

<script>
     <!--
        document.write('<input name="xyz" class="xyzautocomplete" type="text" id="0" value="enter name" >')
     -->
  </script>

  <noscript>
    <input name="xyz" class="xyzautocomplete" type="text" id="0" value="enter name" disabled >
  </noscript>

Upvotes: 1

ikiK
ikiK

Reputation: 6532

It is never good way to put JS inline. Put it after the html element. Also you are targeting id of xyz with does not exists. Your id is 0.

document.getElementById("0").disabled = false;
<input name="xyz"  class="xyzautocomplete"  disabled  type="text" id="0" value="enter name">
As you can see input is disabled, but JS makes it enabled. People who don't have JS wont be able to use input.

Upvotes: 0

Related Questions