Please help with attaching object to an element

[TheCrow]

I'm hoping someone will be able to help with a problem that's really frustrating me.

Is there a way of "attaching" an object to an element? What I have is a table, with cells having IDs like id="cell1", id="cell2", and so on. I have a javascript class that defines an object with an id, some other variables, and event handlers for mouse events (onmousedown, onmouseup, onmousemove). I want to be able to attach the object to the cell.

eg.
function cellClass(id) {
this.id = id;
this.xpos = id.clientX;
this.mousedown = beginEvent;
this.mousemove = duringEvent;
this.mouseup = endEvent;
}

After drawing the table, I'd like to do something like:
for (i=1; i<=numOfCells; i++) {
var x = document.getElementById('cell'+i);
x = new cellClass(i);
}

so that each cell has the variables and event handlers, etc. I've tried so many things, and I just can't get it. The reason for wanting to attach the object after the table is drawn, and not during the table creation is because an AJAX request replaces the cells with new ones, and I'd like to be able to simply call a javascript function after the AJAX request to attach the objects to their corresponding cells. I found out the hard way that the javascript I had embedded (to make the new class while the cell was being drawn) doesn't get executed in the AJAX request.

Any help would be greatly appreciated.

Thanks,
Crow

[penders]

Just wondered... instead of having a JS class, have a function that simply assigns those attributes, like:

function assignAttribs(obj,id) { 
obj.id = id; 
obj.xpos = id.clientX; 
obj.mousedown = beginEvent; 
obj.mousemove = duringEvent; 
obj.mouseup = endEvent; 
}

And then...

for (i=1; i<=numOfCells; i++) { 
var x = document.getElementById('cell'+i); 
assignAttribs(x,i); 
}

...?

[TheCrow]

Thanks penders - I'll give that a try!

[TheCrow]

Well, no go. I'm told "obj has no properties".

[penders]

The above is a bit pseudo code-ish, what code are you currently using?

[TheCrow]

It's all javascript. I've made some progress today, using a combination of my code and yours. Now what I have is:

function cellClass(obj) {
this.obj = obj;
this.obj.onmousedown = beginEvent;
this.obj.onmousemove = duringEvent;
this.obj.onmouseup = endEvent;
}

for (i=1; i<=numOfCells; i++) {
var x = document.getElementById('cell'+i);
new cellClass(x);
}

I was using this to assign these events to table cells. But when I replace the table cells with a new set using AJAX, I thought I could use the same IDs for the cells, and just reassign the objects, but I don't think I can (can I?). I assumed that the old cells and their IDs were destroyed when the AJAX replaced the DIV innerHTML, but when I tried, nothing happened. When I use unique IDs for the new set of table cells, it seems to work. It's not as nice, because now I have to prefix the cells with something, but it might work.

Is there a better way of doing this? Am I even making sense?