user3430848
user3430848

Reputation: 29

Need to enable button when text is entered in field.

I need to enable my button when I type text into my text box. What am I doing wrong?

Code:

<body>
<script>
  function IsEmpty(){ 
    if(input1.value!=null){
      sendbutton.enabled==true;
    }
  }
  IsEmpty();   
</script>

<input class="draft" name="input1" type="text"/> 
     <button class="send" id="sendbutton" disabled>  Send </button> 
     <ul class="messages">
     </ul>
</body>

Upvotes: 0

Views: 1243

Answers (4)

akr
akr

Reputation: 739

You need to assign an id to your input element.
<input class="draft" name="input1" id='input1' type="text"/> 

and in your javascript access it like this:

if(document.getElementById('input1').value != null || document.getElementById('input1').value!='undefined'){
  document.getElementById('sendbutton').disabled=false;
}

Upvotes: 0

Ramon Araujo
Ramon Araujo

Reputation: 1738

To modify an element at the DOM you need either to use pure Javascript's functionality, let's say getElementById function, or any other Javascript framework.

document.getElementById('sendbutton')

Then refer to the attribute and change it.

You can also use JQuery which will help you heaps. I mean, using selectors.

Hope that helps,

Upvotes: 0

Minko Gechev
Minko Gechev

Reputation: 25682

Change you JavaScript to:

var input1 = document.getElementById('input1'),
    sendbutton = document.getElementById('sendbutton');
function IsEmpty(){ 
  if (input1.value){
    sendbutton.removeAttribute('disabled');
  } else {
    sendbutton.addAttribute('disabled', '');
  }
}

input1.onkeyup = IsEmpty;

And HTML:

<input class="draft" id="input1" type="text"/> 
<button class="send" id="sendbutton" disabled>Send</button> 

DEMO

Upvotes: 1

David Knipe
David Knipe

Reputation: 3454

You probably wanted sendbutton.enabled=true;, with a single =. What you've written checks whether they are equal (false, presumably), and then doesn't do anything with the result.

Upvotes: 1

Related Questions