Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: Javascript
I have a simple html form with one number input and two select boxes. I'm trying to practice some object methods of javascript to create a unit converter. My js code is as follows. It gives a constant error of "uncaught reference : fromUnit undefined". This error comes for both select box references.
 
Js Bin code view link : http://jsbin.com/ubeqex/2/edit[^]
 

var unitConvert = {
   
    //get values from the htmlform:
    fromLength:  document.getElementById('fromLength'), //;.value,
    toLength: document.getElementById('toLength').value,
    fromUnit: document.getElementById('fromUnits'),
    toUnit: document.getElementById('toUnits').selectedIndex,
   
 
unitLength: function() {
     
    
        console.log("in function");
         console.log(fromLength.value);  //this works fine.
         console.log(fromUnit);  //this gives error. IF I can access fromLength,   
         console.log(toUnit);  //this gives error. why not these two?
        
}
};
 
function addEvent(obj, type, fn) {
   if(obj && obj.addEventListener) {
       obj.addEventListener(type,fn,false);
   } else if( obj && obj.attachEvent) {
       obj.attachEvent('on' + type, fn);
   }
}
    
window.onload = function() {
   'use strict';
   
   
    var fromUnit = document.getElementById('fromUnits');
    var toUnit = document.getElementById('toUnits').selectedIndex;
    
   addEvent(fromLength, 'change', unitConvert.unitLength); //this works fine.        addEvent(fromUnit, 'change', unitConvert.unitLength);  
   addEvent(toUnit, 'change', unitConvert.unitLength); 
   }   
 

Posted 1-Feb-13 22:24pm
Edited 2-Feb-13 19:39pm
v2
Comments
Vyacheslav Voronenko at 2-Feb-13 4:30am
   
Do you have jsfiddle example for this?
Alternatively provide html part as well.
Member 8155312 at 3-Feb-13 1:41am
   
I have pasted my code on JS Bin. The link is : http://jsbin.com/ubeqex/2/edit
Thank you for looking at my code. Though I have changed it a little bit than original one.
Vyacheslav Voronenko at 3-Feb-13 2:47am
   
Code means that my suggestion below is right. You are lucky that your input is called fromLength.
 
Study a bit
 
https://developer.mozilla.org/en-US/docs/DOM_Client_Object_Cross-Reference/DOM_Events
https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener
 
Play a bit with the debugger.

1 solution

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

I think, you are not in context of unitConvert variable, when event get's called.
 
Moover, From code it looks fromLength is some global variable, at least I do not see it's initialization
 
  addEvent(fromLength, 'change', unitConvert.unitLength); //this works fine.
 
As this is global variable, your code works fine
 
console.log(fromLength.value);  //this works fine
.
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 CPallini 405
1 Sergey Alexandrovich Kryukov 272
2 OriginalGriff 165
3 George Jonsson 159
4 Richard MacCutchan 110
0 OriginalGriff 6,344
1 Sergey Alexandrovich Kryukov 5,890
2 CPallini 5,175
3 George Jonsson 3,559
4 Gihan Liyanage 2,522


Advertise | Privacy | Mobile
Web02 | 2.8.140916.1 | Last Updated 3 Feb 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100