0

I have a HTML form. I want to enable/disable a button until user eneters text in one of the fields. I am adding an event attribute to the which triggers some javascript. This javascript will enable/disable the button. Problem is I can't figure out what event attribute to use. What event attribute please will trigger as soon as user enters data? I tried onchange but that only gets called when i clicked back outside the text area. So it may aswell be onblur.

RyanTCB
  • 7,400
  • 5
  • 42
  • 62
  • For input html element, you can check for `onchange` event which will get fired once after fill and pressing enter... – Rakesh_Kumar Feb 12 '15 at 09:38
  • why not use jquery and simplify life. its the norm now.. check this page for all form events. clean and precise explanation http://api.jquery.com/category/events/form-events/ – MarsOne Feb 12 '15 at 09:38
  • how about `onfocus` ? – egig Feb 12 '15 at 09:39
  • onchange is only called after I finish entering text not whilst. Jquery just seems to be a bit unecessary seeing at HTML has event. onfocus means that the field can be empty when called – RyanTCB Feb 12 '15 at 09:41

2 Answers2

1

You can use the input

function activateForm (event) {
    if(!this.value == ""){ 

    }
}
var input = document.querySelector(".myInput");

input.addEventListener("input", activateForm , false)
Gildas.Tambo
  • 22,173
  • 7
  • 50
  • 78
0

There are 2 possible events that can be used: either onChange or onKeyPress. onChange will trigger when the value of an input has changed while onKeyPress will trigger every time the user types something in a text box. The onChange triggers once the user has CHANGED something in the value, and got out of the input focus. That means the user has to hit TAB or click somewhere else for the event to trigger, hence why onKeyPress might be better suited.

Read more:

http://www.w3schools.com/jsref/event_onchange.asp http://www.w3schools.com/jsref/event_onkeypress.asp

Younger browsers also support onInput which should certainly be prefered for now, if you do not need to support older browsers.

Salketer
  • 14,263
  • 2
  • 30
  • 58
  • This worked and it answered the question. Which was 'what event attribute to use to know when user enters text?'. I used 'onKey'Press and voila. Im interested to know why it was down voted though? – RyanTCB Feb 12 '15 at 09:49
  • 1
    It was down voted because onInput is simply prefered now... Until you face a user with IE8 or IE7 which I do everyday. Note that onkeypress will not trigger if the value is changed programatically (on a button click for example), so oninput would be better in that way... But onchange has also its strengths, and comes to support the 2 other events on select inputs, checkboxes and the like. – Salketer Feb 12 '15 at 09:52
  • Ah ok thanks. Im not too fussed about backwards browser support. I will to an extent but we have to draw the line somewhere. Update your browser or get a new computer I say. – RyanTCB Feb 12 '15 at 10:05
  • 1
    @RyanForsyth I would still suggest using `onkeyup` since you may run into issues validating the input when they delete the values with backspace using `onkeypress` since the event triggers before the value changes. – jungy Feb 12 '15 at 10:05
  • 1
    Couldn't edit my comment so, here is a thorough explanation on stack, although it uses jQuery: http://stackoverflow.com/questions/6458840/on-input-change-event – jungy Feb 12 '15 at 10:18