tag. The text boxes hold the
new X and Y position for the entire panel to which it will be moved. When the user clicks
the button, a function called repositionPanel is executed, and the panel is relocated using
absolute positioning and set to the new coordinates. Figure 4-7 depicts the page when
initially loaded.
Figure 4-7. Using DomElement sample page
Let??™s now examine the script behind repositionPanel that is responsible for moving
the panel to a new location on the page:
function repositionPanel()
{
var panel = $get('MovePanel');
var newX = Number.parseInvariant($get('txtX').value);
var newY = Number.parseInvariant($get('txtY').value);
Sys.UI.DomElement.setLocation(panel, newX,newY);
//Now use getLocation to retrieve the new coordinates
var newPos = Sys.UI.DomElement.getLocation(panel);
alert(String.format("Moved to: {0}, {1}", newPos.x, newPos.y));
}
CHAPTER 4 ?– ASP.NET AJAX CLIENT LIBRARIES 73
Notice how the $get shortcut is used to retrieve the control reference by a specified
ID.
Pages:
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137