JQuery/javascript how do I get the ID of an object?

Question

function cat() {


    this.getMyID = function() { alert(this.id); } ;

}

var bob = new cat();

// I want it to say 'bob'
bob.getMyID();

http://jsfiddle.net/n7eHj/

alerts undefined, any ideas?

I'll elaborate, this is what I want to do - insert into an onclick method of a button something that calls another function, eg:

function cat() {

   this.render = function() { $('#myButton').attr('onclick', 'this.meow()'); };

}

var bob = new cat();
bob.render();

However this will fail because 'this.meow' is nonsense. If I knew the ID, ie. bob, then I could change it to do .attr('onclick', theID + '.meow()'); };

@SLC: Please explain how you think jQuery is related? There's not a single line of jQuery in your code — Ruan Mendes, Mar 21 '11 at 16:44
@Juan I have included the JQuery library, and a JQuery solution would be acceptable? — NibblyPig, Mar 21 '11 at 16:46
possible duplicate of [Get the reference name of an object?](http://stackoverflow.com/questions/3827731/get-the-reference-name-of-an-object) — Felix Kling, Mar 21 '11 at 16:48
@SLC: Your problem has nothing to do with jQuery, JS objects don't have an id property unless you create one. — Ruan Mendes, Mar 21 '11 at 16:49
There is no default "id" property for an object. You can for example add one using some algorithm in the constructor, like using some static incriment. — Andrey, Mar 21 '11 at 16:51
@Felix Thanks that answers it, you have to pass it as a parameter! — NibblyPig, Mar 21 '11 at 16:51
@SLC: No, have a look at your my answer (I just voted to close before you made your edit). Your problem can be solved in an other (cleaner) way. — Felix Kling, Mar 21 '11 at 16:53

Felix Kling · Answer 1 · 2011-03-21T16:56:19.087

Regarding your update:

Assuming cat has a method meow, you should do the following:

function Cat() {
   var that = this;
   this.render = function() { 
       $('#myButton').click(function() {
           that.meow();
       });
   };
}

// assuming it exists something like
Cat.prototype.meow = function() {/*...*/};

You already have a reference to the object (this), you don't need to know in which variable it is stored.

You should also use jQuery's click function to assign a click handler. But be careful though as this would add a new click handler every time you call render().

score 1 · Answer 2 · answered Mar 21 '11 at 16:42

1

Generic "objects" don't have IDs - they don't know what variables are bound to them.

Furthermore you could have said:

var bob = new cat();
var alice = bob;

at which point you have a schizophrenic cat.

answered Mar 21 '11 at 16:42

Alnitak

334,560
70
407
495

score 0 · Answer 3 · answered Mar 21 '11 at 16:43

0

It alerts undefined because cat doesn't have an "id" property. No sure how you expected it to have an id.

answered Mar 21 '11 at 16:43

Ruan Mendes

90,375
31
153
217

score 0 · Answer 4 · answered Mar 21 '11 at 16:52

I will try...

I'll elaborate, this is what I want to do - insert into an onclick method of a button something that calls another function,

Here is some code... is it close?

var bobthefunction = function () {
    // do crazy stuff
   }

$("buttonname").attr("onclick",bobthefunction);

or

$("buttonname").click(bobthefunction);

score 0 · Answer 5 · answered Mar 21 '11 at 16:56

0

What you can do is use closures:

function cat() {
    this.render = function() 
    { 
        $('#myButton').click(function(self ) 
        {
            return function() { self.meow() }
        }(this));
    }
}

By the way, it's not recommended to attach event handlers using .attr - it simply doesn't always work in all browsers/cases. You better use .bind or an even shortcut like .click

answered Mar 21 '11 at 16:56

Andrey

20,487
26
108
176

a self calling function that passes in arguments is not very easy to read, specially for people who haven't seen that pattern. Like others have mentioned, it's easier to store this as a closure variable that can be accessed by the inner handlers. In your case, you would just do `var self = this;` just before calling `this.render = function()` – Ruan Mendes Mar 21 '11 at 20:11
@Andrey : I hope you did not miss understand -- I was not saying it was wrong or there was a better way to do it... just that it hurt my brain. – Hogan Mar 21 '11 at 21:45
@Juan - you are right; I'm so used to "static" objects where I need to use closures because I can't have closure variables, that I overlooked the obvious here – Andrey Mar 21 '11 at 21:56
@Hogan - I know, it used to heart my brain too, until I had to use closures for couple thousand times; now it's like reading kids' book :) – Andrey Mar 21 '11 at 21:56

JQuery/javascript how do I get the ID of an object?

5 Answers5