javascript input field onchange causes "is not a function"

Question

I have a function i would like to run onChange. This works fine with an a-tag. But when i use it on an input-tag it just says:

form.saveFile is not a function

This works:

<a onclick="form.saveFile('fec056b774ffefa479c7dd3a632275cb','fec056b774ffefa479c7dd3a632275cb_filetest'); return false;" href="#">Upload file</a>

This does NOT work:

<input onchange="form.saveFile('fec056b774ffefa479c7dd3a632275cb','fec056b774ffefa479c7dd3a632275cb_filetest');" id="fec056b774ffefa479c7dd3a632275cb_filetest" class="file" type="file"  name="fec056b774ffefa479c7dd3a632275cb_filetest" accesskey="F"/>

Both calls the same form.saveFile(); function.

The form variable is declared in a included js file like this:

form = {
  version: '1.0.0',
  ...alot of functions... 
  saveFile : function(callback,p){
    .................
  }
}

Answer 1

need more info. did you try in all browsers? it should work. If the text has been changed, once the focus leaves the text box onchange will occur. try using alert() to test if the function is really called. there could be something wrong with your function. hope this helps.

Answer 2

Inside forms form does refer to that specific form element. So you need to distinguish between the form that’s referring to the form element and your form variable. You can do so with using window.form if you defined your form variable in the global scope. Or you just rename it.

Answer 3

form is a reserved word in a onchange handler. Just rename your variable and it will work:

var frm = {
    version: '1.0.0',
    saveFile : function(callback,p){
    }
};

<input onchange="frm.saveFile('fec056b774ffefa479c7dd3a632275cb','fec056b774ffefa479c7dd3a632275cb_filetest');" id="fec056b774ffefa479c7dd3a632275cb_filetest" class="file" type="file"  name="fec056b774ffefa479c7dd3a632275cb_filetest" accesskey="F"/>