Uncaught TypeError: Cannot read property 'value' of undefined

I have some JavaScript code that gives this error

Uncaught TypeError: Cannot read property 'value' of undefined 

Code

var i1 = document.getElementById('i1'); var i2 = document.getElementById('i2'); var __i = {'user' : document.getElementsByName("username")[0], 'pass' : document.getElementsByName("password")[0] }; if( __i.user.value.length >= 1 ) { i1.value = ''; } else { i1.value = 'Acc'; } if( __i.pass.value.length >= 1 ) { i2.value = ''; } else { i2.value = 'Pwd'; } 

What does this error mean?

7 Answers

Seems like one of your values, with a property key of 'value' is undefined. Test that i1, i2and __i are defined before executing the if statements:

var i1 = document.getElementById('i1'); var i2 = document.getElementById('i2'); var __i = {'user' : document.getElementsByName("username")[0], 'pass' : document.getElementsByName("password")[0] }; if(i1 && i2 && __i.user && __i.pass) { if( __i.user.value.length >= 1 ) { i1.value = ''; } else { i1.value = 'Acc'; } if( __i.pass.value.length >= 1 ) { i2.value = ''; } else { i2.value = 'Pwd'; } } 

Either document.getElementById('i1'), document.getElementById('i2'), or document.getElementsByName("username")[0] is returning no element. Check, that all elements exist.

Try this, It always works, and you will get NO TypeError:

try{ var i1 = document.getElementById('i1'); var i2 = document.getElementById('i2'); var __i = {'user' : document.getElementsByName("username")[0], 'pass' : document.getElementsByName("password")[0] }; if( __i.user.value.length >= 1 ) { i1.value = ''; } else { i1.value = 'Acc'; } if( __i.pass.value.length >= 1 ) { i2.value = ''; } else { i2.value = 'Pwd'; } }catch(e){ if(e){ // If fails, Do something else } } 

First, you should make sure that document.getElementsByName("username")[0] actually returns an object and not "undefined". You can simply check like

if (typeof document.getElementsByName("username")[0] != 'undefined') 

Similarly for the other element password.

The posts here help me a lot on my way to find a solution for the Uncaught TypeError: Cannot read property 'value' of undefined issue.

There are already here many answers which are correct, but what we don't have here is the combination for 2 answers that i think resolve this issue completely.

function myFunction(field, data){ if (typeof document.getElementsByName("+field+")[0] != 'undefined'){ document.getElementsByName("+field+")[0].value=data; } } 

The difference is that you make a check(if a property is defined or not) and if the check is true then you can try to assign it a value.

You can just create a function to check if the variable exists, else will return a default value :

function isSet(element, defaultVal){ if(typeof element != 'undefined'){ return element; } console.log('one missing element'); return defaultVal; } 

And use it in a variable check:

var variable = isSet(variable, 'Default value'); 

You code looks like automatically generated from other code - you should check that html elements with id=i1 and i2 and name=username and password exists before processing them.