Question

I’m putting together a JavaScript object called ListBox which takes a two-dimensional array, and outputs it in a table with fixed column titles, scrollable content, and is sortable by clicking a column title. In order for the HTML to include event handlers which call the object’s own methods, the object needs to know its own instance variable name, eg….

var MyList = new ListBox();

After setting up the columns & contents the appropriate method will generate the HTML…

...
<td class="ListBox_ColumnTitle" onclick="MyList.SortByColumn(1)">...</td>
...

By searching here on stackoverflow I found the following code, and adapted it slightly so it finds the right instance of the object:

for (var v in window) {
    try {
        if (window[v] instanceof ListBox) { InstanceName = v; break; }
        }
    catch (e) { }
    }

However this doesn’t work inside the constructor function – it simply doesn’t find the instance. It works fine afterwards, but I’d like to be able to do it within the constructor to make the code which is using ListBox simpler – is this possible?

Also I do realise it would be much simpler to just pass the variable name as a parameter of the constructor, but I’d like to avoid this if I can.

Answer 1

You can avoid this problem completely by binding the events in script and not outputing onclick attributes.

function ListBox() {
    var that = this;

    // do your existing stuff

    var element = ...; // whatever you're currently doing to create the html
    element.onclick = function () {
        that.SortByColumn(1);
    };
}