Uncaught TypeError: Cannot read property 'value' of undefined

Question

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?

score 36 · Accepted Answer · edited Jul 27 '17 at 20:46

36

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'; }
}

edited Jul 27 '17 at 20:46

Chris Stryczynski

19,899
28
104
198

answered Jul 01 '11 at 16:50

OsQu

1,028
8
12

3

This help me to find out my problem. I have moved my script code from head section to body section and the problem is solved. – maruf Nov 04 '16 at 08:29

score 13 · Answer 2 · answered Jul 01 '11 at 16:48

13

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

answered Jul 01 '11 at 16:48

nfechner

16,559
7
43
63

1

thanks... i forget that when user is logged in , there is no input named username or password... i have added if statement ' if(i2 && i2) ' and it works.. sometimes easiest code may get you in trouble :D – John Jul 01 '11 at 16:53

score 10 · Answer 3 · answered May 09 '14 at 14:34

10

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
    }
}

answered May 09 '14 at 14:34

Joe L.

3,452
1
16
13

Thanks for showing the proper way of doing this. Althought I'm curious why the `if(e)` needs to be inside `catch(e)` since it already caught the `(e)` – TetraDev Apr 05 '16 at 15:40
@TetraDev 'e' will return 'undefined' unless it's a valid TypeError. So you validate the TypeError in the 'if' statement and you can also execute custom TypeErrors. – Joe L. Apr 05 '16 at 20:43
simple and great :) – Oct 04 '17 at 17:39

score 6 · Answer 4 · answered Jul 01 '11 at 16:49

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.

score 5 · Answer 5 · edited Feb 20 '14 at 17:32

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.

score 0 · Answer 6 · answered Oct 22 '18 at 08:23

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');

score 0 · Answer 7 · answered Apr 15 '19 at 03:02

0

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.

answered Apr 15 '19 at 03:02

Kamil Kiełczewski

53,729
20
259
241

Uncaught TypeError: Cannot read property 'value' of undefined

7 Answers7

Linked

Related