Javascript Object not defined after being created in a function

Question

I can't seem to return an object from a function, the console.log inside the function prints out the property values fine but once outside the function I'm getting "Uncaught ReferenceError: firstOn is not defined"

Any help would be appreciated, thanks!

myElement = document.getElementById("testButton");

function Server(name,tables,startTime) {
    this.name = name;
    this.tables = tables;
    this.startTime = startTime;
}


document.forms.server1.button.onclick = function() {
    var name = document.forms.server1.servername.value;
    var tables = document.forms.server1.servertables.value;
    var startTime = document.forms.server1.servertime.value;

    var firstOn = new Server(name,tables,startTime);

    document.forms.server1.button.innerHTML = "Saved!";

    console.log(firstOn.name);
    console.log(firstOn.tables);
    console.log(firstOn.startTime);

    return firstOn;

};

myElement.onclick = function() {
    console.log(firstOn.name);
    console.log(firstOn.tables);
    console.log(firstOn.startTime);

};

It's only available in the scope it was declared in. Move the declaration out of the function. You might also need to get rid of var — sachleen
– sachleen, Commented Jul 24, 2012 at 21:09

Mike Brant · Accepted Answer · 2012-07-24 21:10:15Z

3

That firstOn object was created in the local function scope. It will not be available globally in the second function.

answered Jul 24, 2012 at 21:10

Mike Brant

71.4k10 gold badges102 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jfriend00 · Accepted Answer · 2012-07-24 21:15:02Z

firstOn is an object that was created and returned from the document.forms.server1.button.onclick event handler. The return value from that event handler went into the system (that's where event handlers return to) and was never stored anywhere so it was cleaned up by the system with garbage collection.

Meanwhile, your myElement.onclick event handler does NOT have access to the firstOn object because it wasn't saved anywhere that myElement.onclick can reach.

If you want firstOn to be usable after the document.forms.server1.button.onclick event handler, you have to save it somewhere that the second click handler can each. That could be in a global variable or it could be a property of some other object that is globally accessible. As your code is written right now, the firstOn object is created, but never stored anywhere so it is happily cleaned up by the garbage collector and is not reachable by other code.

user1505254 · Accepted Answer · 2012-07-24 21:14:38Z

0

I think this is the appropriate solution to my problem.

myElement = document.getElementById("testButton");

function Server(name,tables,startTime) {
    this.name = name;
    this.tables = tables;
    this.startTime = startTime;
}

var firstOn = new Server();

document.forms.server1.button.onclick = function() {
    firstOn.name = document.forms.server1.servername.value;
    firstOn.tables = document.forms.server1.servertables.value;
    firstOn.startTime = document.forms.server1.servertime.value;

    document.forms.server1.button.innerHTML = "Saved!";

    console.log(firstOn.name);
    console.log(firstOn.tables);
    console.log(firstOn.startTime);

    return firstOn;

};

myElement.onclick = function() {
   console.log(firstOn.name);
   console.log(firstOn.tables);
   console.log(firstOn.startTime);
};

answered Jul 24, 2012 at 21:14

user1505254

1 Comment

jfriend00 Over a year ago

There's no point in returning firstOn from document.forms.server1.button.onclick. That accomplishes nothing. This solution (storing it in a global variable), is consistent with what I explained in my answer and is one of the options for fixing your original problem.

Tchoupi · Accepted Answer · 2012-11-08 18:48:03Z

0

var firstOn = new winMain.Server(name,tables,startTime);

edited Nov 8, 2012 at 18:48

Tchoupi

14.7k5 gold badges39 silver badges71 bronze badges

answered Nov 8, 2012 at 18:30

Nikhil

1

1 Comment

Ben Carey Over a year ago

Try to give an explanation as well :-)

Collectives™ on Stack Overflow

Javascript Object not defined after being created in a function

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest