Ideas on making a javascript object name unique in ASP.Net?

Question

I've created an ASP.Net user control that will get placed more than once inside of web page. In this control I've defined a javascript object such as:

function MyObject( options )
{
  this.x = options.x;
}

MyObject.prototype.someFunction=function someFunctionF()
{
  return this.x + 1;
}

In the code behind I've created MyObject in a startup script --

var opts = { x: 99 };

var myObject = new MyObject( opts );

When a certain button in the control is pressed it will call myObject.someFunction(). Now lets say the value of x will be 99 for one control but 98 for another control. The problem here is that the var myObject will be repeated and only the last instance will matter. Surely there's a way to make the var myObject unique using some concept I've haven't run across yet. Ideas?

Thanks,

Craig

Answer 1

If it is just one value, why not have the function take it as a parameter and build your onclick handler so that it puts the correct value in for each control. If it is more complex than that, then consider making options an array and, for each control, insert the correct options into the spot in the array that corresponds to each particular control. Then pass the proper index into the array into the function.

Answer 2

I do this by using ScriptManager.RegisterClientScriptBlock to register a string as a JavaScript block on the client side. I can then modify my script string using {0}, {1}..,{n} place holders to inject necessary ids. It depends on the structure of your code as to if this is the most elegant fashion, but it works in a pinch. You could then inject variable names using references to Me.ClientID.

Answer 3

You can make the value of "x" static and access it anywhere in the code, such as:

function MyObject( options ) { MyObject.x = options.x; }
MyObject.x = 99; // static
MyObject.prototype.someFunction = function () { return MyObject.x + 1; }

This way you can access MyObject.x anywhere in your code, even without re-instanciating MyObject.

Answer 4

Your Javascript like this:-

function MyObject(options) { this.x = options.x; }
MyObject.prototype.someFunction = function() { return this.x + 1; }
MyObject.create(id, options) {
    if (!this._instances) this._instances = {};
    return this._instances[id] = new MyObject(options);
}
MyObject.getInstance(id) { return this._instances[id]; }

Your startup javascript like this:-

MyObject.create(ClientID, {x: 99});

Other code that needs to use an instance (say in the client-side onclick event)

String.Format("onclick=\"MyObject.getInstance('{0}').someFunction()\", ClientID);

Note the low impact on the clients global namespace, only the MyObject identifier is added to the global namespace, regardless of how many instances of your control are added to the page.

Answer 5

Excellent solution Anthony. The other solutions offered were as good and I did consider them but I was looking for something a little more elegant like this solution. Thanks!