In an earlier question I worked out how to store object as properties. Now I am trying to access those properties when the object is passed through an event but can't get it to work:
<script language="javascript">
$(document).ready(function() {
//create a TestObject
function TestObject() {
this.testProperty = "green";
}
//and an instance of it
var testObject = new TestObject();
//attach this instance to the div as a property
var test;
test = $('#test');//the div
jQuery.data(test, "obj", testObject);
//prove it worked and the TestObject is assigned
alert(jQuery.data(test, "obj").testProperty);//works
$('#test').click(TestClick);
//test.click(TestClick); doesn't work either
function TestClick() {
alert($(this).attr("id"));//displays "test" - works
alert(jQuery.data($(this), "obj").testProperty);
//testProperty is null or not an object??
//clearly TestObject is no longer attached to the div, why?
//Or have I attached it the wrong way?
//alert(jQuery.data(this, "obj").testProperty); doesn't work either
};
});
</script>
<body>
<form id="form1" runat="server">
<div id="test">Here is a test div</div>
</form>
</body>