Setting custom properties

[Jason Butera]

I know that I can read/write custom properties of an object by using
the following:

Setting:
document.all['Control'].customProp = "this";
Getting:
document.all['Control'].customProp;

Is there a way I can run code when this custom property is set. Or
perhaps there is a way to create a custom method?

Example:
<span id="MySpan"><in put type="text"></span>

I'd the property:
document.all['MySpan'].enabled = true;
To automatically do this:
document.all['MySpan'].controls[0].disabled = !thevalue;

OR the method
document.all['MySpan'].enable();
To do this:
document.all['MySpan'].disabled = false;

[Michael Winter]

Re: Setting custom properties

On 30 Aug 2004 14:46:48 -0700, Jason Butera <jjbutera@hotma il.com> wrote:
[color=blue]
> I know that I can read/write custom properties of an object by using
> the following:
>
> Setting:
> document.all['Control'].customProp = "this";
> Getting:
> document.all['Control'].customProp;[/color]

If you plan for this code to run on any browser other than IE (and its
compatibles), don't use document.all. See:

<URL:http://www.jibbering.c om/faq/faq_notes/alt_dynwrite.ht ml#getEl>
[color=blue]
> Is there a way I can run code when this custom property is set.[/color]

There are extensions that allow it, but it seems that a lot of browsers
don't allow it. It's safer to use methods.
[color=blue]
> Or perhaps there is a way to create a custom method?[/color]

You can attach a method to an object by assigning a function reference to
a property. This reference can either be a standard function statement:

function myFunction() {
// do stuff
}

obj.myMethod = myFunction;
obj.myMethod();

or a function expression:

obj.myMethod = function() {
// do stuff
};
obj.myMethod();

Note that in both cases, only 'obj' has the myMethod property. If this
were a user-defined object, you could use the prototype property of the
constructor to add the method universally.

function MyObject() {
}
MyObject.protot ype.myMethod = function() {
};

var obj = new MyObject();
obj.myMethod();

However, support for the prototype object on host objects, such as HTML
elements, is not widely available. It might be easier to define a global
function that takes a reference to the host object in question, and any
other arguments, and work that way.
[color=blue]
> Example:
> <span id="MySpan"><in put type="text"></span>
>
> I'd the property:
> document.all['MySpan'].enabled = true;
> To automatically do this:
> document.all['MySpan'].controls[0].disabled = !thevalue;[/color]

SPAN elements don't have a controls collection, even in IE.
[color=blue]
> OR the method
> document.all['MySpan'].enable();
> To do this:
> document.all['MySpan'].disabled = false;[/color]

Only IE, as far as I know, supports the disabled property on non-form
elements.

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

[Jason Butera]

Re: Setting custom properties

Thanks a lot Michael.

1. My app is internal for IE only so document.all is OK. I'll keep your
tip in mind for my other apps.

2. I don't need to prototype. I just need to set individual objects.

3. You are correct, span does not have a controls collection. I meant to
say "children".

I appreciate your help. I'll get to work on it!

Jason

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

[Thomas 'PointedEars' Lahn]

Re: Setting custom properties

Jason Butera wrote:
[color=blue]
> I know that I can read/write custom properties of an object by using
> the following:
>
> Setting:
> document.all['Control'].customProp = "this";
> Getting:
> document.all['Control'].customProp;[/color]

You _don't_ know.

1. document.all is a feature of the IE browser component (IE).

2. The MSDN Library specifies document.all to be a method, not
an object. There is an ambiguity in the IE DOM to allow
collections be referenced like methods and vice-versa, but
I recommend to stick to the documentation:

document.all('C ontrol').custom Prop = "this";

3. You don't test for your references prior to access:
<http://www.pointedears .de/scripts/test/whatami>

4. ECMAScript (3) allows host objects be specified in a
way that it is impossible to add properties to them.
[color=blue]
> Is there a way I can run code when this custom property is set.[/color]

You mean a setter, available in JavaScript. But IE
supports JScript and so you cannot do that there.
[color=blue]
> Or perhaps there is a way to create a custom method?[/color]

A method is but a property of type "function" (and sometimes in the IE DOM,
for host objects, of type "object"), so if you can add properties to an
object, you can add methods as well.
[color=blue]
> Example:
> <span id="MySpan"><in put type="text"></span>[/color]

What should this achieve?
[color=blue]
> I'd the property:
> document.all['MySpan'].enabled = true;
> To automatically do this:
> document.all['MySpan'].controls[0].disabled = !thevalue;[/color]

Not in JScript. In JavaScript, in a Gecko-based
browser you could do this (quick hack):

var o;
if (document
&& document.getEle mentById
&& (o = document.getEle mentById('MySpa n')))
{
o.enabled setter = function(v)
{
if (typeof this.controls == "undefined" )
{
this.controls = [];
}

if (typeof this.controls[0] == "undefined" )
{
this.controls[0] = {};
}

this.controls[0].disabled = !v;
}
}

<http://devedge.netscap e.com/library/manuals/2000/javascript/1.5/guide/obj.html#101832 5>
[color=blue]
> OR the method
> document.all['MySpan'].enable();
> To do this:
> document.all['MySpan'].disabled = false;[/color]

This is possible with every ECMAScript compliant implementation,
including JScript, provided that the host object (o) exists and
supports adding properties (see above):

// ...
o.enable = function()
{
this.disabled = false;
}
// ...

In an ECMAScript 3 compliant implementation, like JScript 5.6,
one should do

// ...
try
{
document.all('M ySpan'].enable = function()
{
this.disabled = false;
}
}
catch (e)
{
// handle the exception here
}
// ...


HTH

PointedEars
--
God punishes those who survive too extravagantly.

[Thomas 'PointedEars' Lahn]

Re: Setting custom properties

Thomas 'PointedEars' Lahn wrote:
[color=blue]
> In an ECMAScript 3 compliant implementation, like JScript 5.6,
> one should do
>
> // ...
> try
> {
> document.all('M ySpan'].enable = function()[/color]

Should be

o.enable = function()
[color=blue]
> {
> this.disabled = false;
> }
> }
> catch (e)
> {
> // handle the exception here
> }
> // ...[/color]


PointedEars

[Grant Wagner]

Re: Setting custom properties

> 2. The MSDN Library specifies document.all to be a method, not[color=blue]
> an object. There is an ambiguity in the IE DOM to allow
> collections be referenced like methods and vice-versa, but
> I recommend to stick to the documentation:
>
> document.all('C ontrol').custom Prop = "this";[/color]

<url: http://msdn.microsoft.com/workshop/a...ctions/all.asp />

"all Collection"
....
"Remarks - The all collection includes..."
....
"Standards Information - There is no public standard that applies to this collection."


The MSDN Library documentation clearly does not specify document.all to be a method. The
MSDN Library documentation may use "method-like" syntax for collections, but collections are
clearly documented to be collections, not methods.


To add further weight to the argument that [] are the correct notation to use for IE
collections:

<url: http://msdn.microsoft.com/workshop/a...s/elements.asp />

indicates the use of FORM.elements(. ..), yet I doubt the person proposing the use of
document.all() would recommend the use of FORM.elements() , despite their advice to "stick to
the documentation". Continue using document.all[] since it is supported now, and will
continue to be supported long into the future.

--
Grant Wagner <gwagner@agrico reunited.com>
comp.lang.javas cript FAQ - http://jibbering.com/faq