Huh! Office 2010 Beta is out for public. I’d started downloading. What about you?
Here is the direct download link.
Thanks.
All Day, I Dream about Codes
Huh! Office 2010 Beta is out for public. I’d started downloading. What about you?
Here is the direct download link.
Thanks.
How to get the time elapsed time after loading a webpage, using Callback() in MS Ajax library. Here is a sample script;
[Ajax-Script]
1: <script type="text/javascript">
2: // Page Load
3: function pageLoad() {
4: var loadTime = {date : new Date()};
5: var callback = Function.createCallback(onBtnClick, loadTime);
6: 7: $addHandler($get("Button1"), "click", callback);
8: } 9: 10: function onBtnClick(event, context) {
11: var loadTime = context.date;
12: var elapseTime = (new Date() - loadTime) / 1000;
13: 14: $get("Text1").value = elapseTime + " Seconds";
15: } 16: </script>[HTML-Script]
1: <form id="form1" runat="server">
2: <asp:ScriptManager ID="ScriptManager1" runat="server">
3: </asp:ScriptManager>
4: <div>
5: Time elapsed since PageLoad: 6: <input id="Text1" type="text" />
7: <input id="Button1" type="button" value="Get Elapsed Time" />
8: </div>
9: </form>
Thanks.
Another careless mistake : when I used the setLocation() method in the DomElement class in Sys.UI namespace. I tried to set the location of a DIV element using the value which I read from a textbox and I’s thrown with the error:
Sys.ArgumentTypeException: Object of type 'String' cannot be converted to type 'Number'
After taking a close look, I found it. The setLocation() method clearly states that I’ve to enter the (x,y) coordinates as integer data type. Take a look:
Aaahhh…!!! See how careless I’m. Soon, I fixed the small careless-bug using ParseInt() as
Hope, you’ll be more careful.
Thanks.
For handling the DOM elements, Microsoft Ajax library has a Class named DomElement in the Sys.UI namespace. The DomElement class has 2 methods as follows:
a) getLocation(element-name): returns the (x,y) coordinate of the DOM element.
b) setLocation(element, x-pos, y-pos): sets the DOM element to (x,y) position.
Here is a simple example on repositioning a DOM element using the Ajax library;
[Ajax Script]
1: <script type="text/javascript">
2: //Page Load
3: function pageLoad() {
4: var btnGet = $get("btnGetPos");
5: var btnSet = $get("btnSetPos");
6: 7: $addHandler(btnGet, "click", getXYLocation);
8: $addHandler(btnSet, "click", setXYLocation);
9: 10: 11: } 12: 13: // Get (X,Y) Location
14: function getXYLocation() {
15: var location = Sys.UI.DomElement.getLocation(div1);
16: 17: var tbX = $get("tbXpos");
18: var tbY = $get("tbYpos");
19: 20: tbX.value = location.x; 21: tbY.value = location.y; 22: } 23: 24: // Set (X,Y) Location
25: function setXYLocation() {
26: var tbX = $get("tbXpos").value;
27: var tbY = $get("tbYpos").value;
28: 29: alert(tbX + tbY); 30: 31: Sys.UI.DomElement.setLocation(div1, parseInt(tbX), parseInt(tbY)); 32: } 33: 34: // Unload Page
35: function pageUnload() {
36: var btnGet = $get("btnGetPos");
37: var btnSet = $get("btnSetPos");
38: 39: $removeHandler(btnGet, "click", getXYLocation);
40: $removeHandler(btnSet, "click", setXYLocation);
41: } 42: </script>[HTML-Script]
1: <form id="form1" runat="server">
2: <asp:ScriptManager ID="ScriptManager1" runat="server">
3: </asp:ScriptManager>
4: <div id="div1" style="border: ridge 1px Black; width: 250px; text-align: justify;">
5: This is a sample text inside an HTML for demonstrating CSS Positioning using ASP.NET Ajax Library.6: </div>
7: <br />
8: <div>
9: X-Coord: <input id="tbXpos" type="text" /><br />
10: Y-Coord: <input id="tbYpos" type="text" /><br />
11: <input id="btnGetPos" type="button" value="Get (X,Y) Location" />
12: <input id="btnSetPos" type="button" value="Set (X,Y) Location" />
13: </div>
14: </form>
Thanks.
In my previous article Avoid Numbers in Textbox using ASP.NET AJAX, I showed how you can prevent numbers from being entered into a Textbox, using ASP.NET AJAX Framework.
In that example, the code segment e.charCod and preventDefault() designates a property belonging to Sys.UI.DomEvent class. The Sys.UI is the class provided by the AJAX Framework to work with the DOM components in a webpage. And you can say, Sys is the root namespace or mother-of-all classes, just like System is the root namespace in C#.
After a slight Binging, I’s able to get a lot more properties of the Sys.UI.DomEvent class. Please note, they are cross-browser objects. Here is the list:
| Properties | Descriptions |
| rawEvent | event-data object built by the current browser |
| shiftKey | Returns TRUE, if SHIFT key was pressed |
| ctrlKey | Returns TRUE, if CTRL key was pressed |
| altKey | Returns TRUE, if ALT key was pressed |
| button | captures the mouse-button click and has values as (leftButton, middleButton and rightButton) |
| charCode | character code for the typed characters |
| clientX | returns the x-coordinate of the mouse location relative to client area of the page |
| clientY | returns the y-coordinate of the mouse location relative to client area of the page |
| target | represents the Element that raised the event |
| screenX | x-coordinate of mouse-pointer relative to screen |
| screenY | y-coordinate of mouse-pointer relative to screen |
| type | Returns name/type of the event (click/mouse) |
| preventDefault() | Prevents the default action associated with that event |
| stopPropagation() | Prevents the event from propagation to the element’s parent nodes |
Hope this is handy.
Thanks.
