[cfaussie] Re: [OT] Reference to JS object

Tue, 21 Feb 2006 05:08:14 -0800

Your problem is that you need to reference the function in the onclick as part of the INSTANCE of the object. Otherwise, the  onclick event is firing a call to a global method.

E.g.

TabbedInterface.prototype.doMakeActive = function(obj)
{}

TabbedInterface.prototype.doAddTab = function()
{
var thisInstance = this;

         var myListItem = document.createElement( "li" );
                                        var myLink = document.createElement( "a" );
                                        var myIFrame = document.createElement( "iframe" );
                                        myLink. false;";
                                        myLink.innerHTML = linkText;
                                        myLink.href = "">                                        myListItem. () { thisInstance.doMakeActive( this ); }

}

Darryl


On 2/21/06, Taco Fleur <[EMAIL PROTECTED] > wrote:

Doesn't work, see attached;
<script>
                        //var activeTab = null;
                        function _doMakeActive( object )
                        {
                                var layerType = "iframe";
                                if ( activeTab != null )
                                {
                                        activeTab.style.backgroundColor = "##D4D0C8";
                                        activeTab.childNodes[ 0 ].style.color = "##000";
                                }
                                object.style.backgroundColor = "##0A246A";
                                object.childNodes[ 0 ].style.color = "##fff";
                                activeTab = object;
                                object.getElementsByTagName( layerType )[ 0 ].style[ "display" ] = "block";
                                var listItemCollection = object.parentNode.getElementsByTagName ( "li" );
                                for ( var i = 0; i < listItemCollection.length; i++ )
                                {
                                        if ( listItemCollection[ i ] != object )
                                        {
                                                listItemCollection[ i ].getElementsByTagName( layerType )[ 0
].style[ "display" ] = "none";
                                        }
                                        //alert( listItemCollection[ i ].innerHTML );
                                }
                        }

                        function TabbedInterface( identity )
                        {
                                this.activeTab = null;
                                this.dom = document.createElement( "ul" );
                                 this.dom.id = identity;
                                return this;
                        }
                        TabbedInterface.prototype =
                        {
                                init:function()
                                {
                                        return this;
                                },
                                getActiveTab:function()
                                {
                                        return this.activeTab;
                                },
                                setActiveTab:function( activeTab )
                                {
                                         this.setActiveTab = activeTab;
                                        return this;
                                },
                                getDOM:function()
                                {
                                        return this.dom;
                                },
                                doAddTab:function( linkText, source )
                                {
                                        var myListItem = document.createElement ( "li" );
                                        var myLink = document.createElement( "a" );
                                        var myIFrame = document.createElement( "iframe" );
                                        myLink. false;";
                                        myLink.innerHTML = linkText;
                                        myLink.href = ""
                                        myListItem. () { doMakeActive( this ); }

                                        //myListItem. this );";
                                         myListItem.appendChild( myLink );
                                        myIFrame.src = "">                                        myListItem.appendChild( myIFrame );
                                         this.getDOM().appendChild( myListItem );

                                        return this;
                                },
                                doWrite:function() // Writes the DOM to the document
                                {
                                        document.write( this.getDOM().outerHTML );
                                        alert( this.getDOM().outerHTML );
                                        return this;
                                },
                                doMakeActive:function( object, selfReference )
                                {
                                        alert( 'yup' );
                                        var layerType = "iframe";
                                        var activeTab = this.activeTab;
                                        if ( activeTab != null )
                                        {
                                                 activeTab.style.backgroundColor = "##D4D0C8";
                                                activeTab.childNodes[ 0 ].style.color = "##000";
                                        }
                                         object.style.backgroundColor = "##0A246A";
                                        object.childNodes[ 0 ].style.color = "##fff";
                                        this.setActiveTab( object );
                                        object.getElementsByTagName( layerType )[ 0 ].style[ "visibility"
] = "visible";
                                        var listItemCollection = object.parentNode.getElementsByTagName ( "li" );
                                        for ( var i = 0; i < listItemCollection.length; i++ )
                                        {
                                                if ( listItemCollection[ i ] != object )
                                                {
                                                        listItemCollection[ i ].getElementsByTagName( layerType )[ 0
].style[ "visibility" ] = "hidden";
                                                }
                                        }

                                        return this;
                                }
                        }

                        var tabbedInterface = new TabbedInterface( "tabbed-interface" ).init();
                        //doMakeActive = tabbedInterface.doMakeActive;
                        tabbedInterface.doAddTab ( "Job", "job-detail.cfm" );
                        tabbedInterface.doAddTab( "Company", "company-detail.cfm" );
                        tabbedInterface.doAddTab( "Skills", " job-skill.cfm" );
                        tabbedInterface.doAddTab( "Internal", "internal.cfm" );
                        tabbedInterface.doAddTab( "Other", "other.cfm" );
                        tabbedInterface.doWrite();
                        </script>

On 2/21/06, Steve Onnis <[EMAIL PROTECTED]> wrote:
>
> Try this
>
> doAddTab:function( linkText, source )
> {
>        var myListItem = document.createElement( "li" );
>        var myLink = document.createElement( "a" );
>        var myIFrame = document.createElement( "iframe" );
>        myLink. false;";
>        myLink.innerHTML = linkText;
>        myLink.href = ""> >        myListItem. () {
>                doMakeActive( this );
>                }
>        return this;
> },
>
> That is ofcourse you have the doAddTab function associated with the rest of
> the object.
>
> Probably better to use prototypes for something like this
>
>
>
> -----Original Message-----
> From: cfaussie@googlegroups.com [mailto:cfaussie@googlegroups.com] On Behalf
> Of Taco Fleur
> Sent: Tuesday, February 21, 2006 10:22 PM
> To: cfaussie@googlegroups.com
> Subject: [cfaussie] [OT] Reference to JS object
>
>
> I have a JS object with the following method;
>
> doAddTab:function( linkText, source )
> {
>        var myListItem = document.createElement( "li" );
>        var myLink = document.createElement( "a" );
>        var myIFrame = document.createElement( "iframe" );
>         myLink. false;";
>        myLink.innerHTML = linkText;
>        myLink.href = "">>        myListItem. this );";
> ................
>        return this;
> },
>
> The problem is with myListItem. this );";
> as it should really have a reference to the object itself, eg.
> myListItem. this );";
>
> But ofcourse I don't know what SomeObject is until the object is
> instantiated like so;
> myObject = new SomeName().init();
>
> Does anyone know a way around this?
>
> --
> Taco Fleur - http://www.pacificfox.com.au
> Web Design, Web development, Graphic Design and Complete Internet Solutions
> an industry leader with commercial IT experience since 1994 .
>
>
>
>
>
>


--
Taco Fleur - http://www.pacificfox.com.au
Web Design, Web development, Graphic Design and Complete Internet Solutions

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "cfaussie" group.
To post to this group, send email to cfaussie@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at http://groups.google.com/group/cfaussie
-~----------~----~----~----~------~----~------~--~---

Reply via email to