JavaScript Error: Uncaught TypeError: Cannot set property 'value' of null

Question

Below is my code:

var obj = null;
var voterIC = "";

$(function ()
{
  $("#btnRegister").click(function (e)
  {
    voterIC = $("#nric").val();

    if ( voterIC == "")
        $("#messageEdit").html("<h4 style=\"color:red\">Please fill in NRIC!</h4>");
    else
        obj = new Object();
        obj.NRIC = voterIC;
        obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;

    var newPostKey = firebase.database().ref().child('voter').push().key;

    var updates = {};
    updates['/voter/' + newPostKey] = obj;

    firebase.database().ref().update(updates).then(function()
    {
      $("#messageEdit").html('<h10 style=\"color:red\"><b>Update Successfully</h10><b>');
    });
  });
});

Why do I get the following error and how to solve this error?

Uncaught TypeError: Cannot set property 'NRIC' of null

Thank You.

You're lacking some parenthesis in the else branch of your if. Without them, only the first line obj = new Object() is within the else branch, while the remainder is one level up. Hence the variable obj is not initialized at that point. — Sirko
– Sirko, Commented Feb 10, 2020 at 10:59

Rory McCrossan · Accepted Answer · 2020-02-10 11:00:27Z

The problem is because you have not put braces around the blocks in your if condition. When formatted correctly your code looks like this:

if (voterIC == "") {
    $("#messageEdit").html("<h4 style=\"color:red\">Please fill in NRIC!</h4>");
} else {
    obj = new Object();
}

obj.NRIC = voterIC;
obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;

Consider the case when voterIC is an empty string. You only set the value of obj to a new object when this does not happen. Then you continue on to try and set the NRIC property of the object, but due to the logic flow, it doesn't exist.

To correct the problem, put the braces around all statements in a conditional statement:

if (voterIC == "") {
  $("#messageEdit").html("<h4 style=\"color:red\">Please fill in NRIC!</h4>");
} else {
  obj = new Object();
  obj.NRIC = voterIC;
  obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;
}

Barmar · Accepted Answer · 2020-02-10 11:00:55Z

1

If you indent the code correctly, you'll see that the if statement is equivalent to this:

if (voterIC == "")
  $("#messageEdit").html("<h4 style=\"color:red\">Please fill in NRIC!</h4>");
else
  obj = new Object();
obj.NRIC = voterIC;
obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;

When voterIC == "", you never assign obj, so you get that error.

You need to put braces around the else block to fix this.

if (voterIC == "") {
  $("#messageEdit").html("<h4 style=\"color:red\">Please fill in NRIC!</h4>");
} else {
  obj = new Object();
  obj.NRIC = voterIC;
  obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;
}

See Why is it considered a bad practice to omit curly braces?

answered Feb 10, 2020 at 11:00

Barmar

789k57 gold badges555 silver badges669 bronze badges

Comments

Peter Haddad · Accepted Answer · 2020-02-10 11:00:22Z

0

You need to use brackets for the else statement:

else{
obj = new Object();
obj.NRIC = voterIC;
obj.CreatedDate = firebase.database.ServerValue.TIMESTAMP;
}

answered Feb 10, 2020 at 11:00

Peter Haddad

81.2k26 gold badges148 silver badges149 bronze badges

Collectives™ on Stack Overflow

JavaScript Error: Uncaught TypeError: Cannot set property 'value' of null

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related