javascript design pattern on page with 2 or more objects
<p>I need to choose the right design pattern. My page have 2 objects created from same constructor. The problem that i have is detecting which object is getting a click event. </p>

<p>I am doing this after object creation:</p>

<pre><code>$("table tr, table button,.dataTables_paginate a").click(function (e) {
    **myTableName.buttonPressed($(this));**

});
</code></pre>

<p>and </p>

<pre><code> buttonPressed: function (el) {
    if (el.is('a') &amp;&amp; el.closest('li').hasClass('paginate_button')) {
        var objName = el.attr('aria-controls');
        debugger;
    }
    else {
        var objName = $(el).closest('table').attr('id');
    }

    **this.getName(objName);**
    tbl = myTableName.tbl;
    editor = myTableName.editor;
    //myTableName.acl(myTableName.currentForm);

},
</code></pre>

<p>and then</p>

<pre><code> getName: function (objName) {
    // search through the global object for a name that resolves to this object
    for (var name in window)
        if (window[name] == this) {
            if (objName) {
                myTableName = window[objName];
                //window.myState[this.myInstanceName] = jQuery.extend({}, this);
                break;
            } else {
                window[name] = this;
                window[window[name]] = window[name];
                myTableName = window[window[name]];
                // window.myState[this.myInstanceName] = jQuery.extend({}, this);
            }
            break;
        }
},
</code></pre>

<p>Besides these are all globals , i dont fell this is the correct way to do that.</p>

<p>Thoughts?</p>