Atlas Client Controls - Accessing HTML Elements
(Page 3 of 4 )
Atlas controls also enable you to put HTML controls in the page and then access them usingan object-oriented, client-side approach. So although you are using HTML elements, you can use a client-side abstraction layer to access their contents.
The syntax for using Atlas to access HTML elements can seem a bit strange at first. Imagine the page contains a<span>element like the following:
<span id="Label1">This is a label</span>
You could also use a<label>HTML element; however, this is most commonly used as a caption element for form fields, although the output in the browser is identical to a<span>element.
If you were using plain old JavaScript, you could access this element with the following code:
var label = document.getElementById("Label1")
You could then set some properties of this element, including style information. However, the exact JavaScript you use would be different on different browsers, and you have to have a fairly good knowledge of JavaScript and the DOM, beyond just mastering the syntax.
The Atlas way is different. First, you have to determine the appropriate Atlas control class for the client-side element. (These are listed in Table 4-1.) For the<span>element, you useSys.UI.Label. The code must instantiate the class and provide the ID of the HTML element. However this ID will be specified in a nonstandard way: startingwith a dollar sign, and with the actual ID in parentheses:
var label = new Sys.UI.Label($("Label1"));
The next step is not mandatory in this specific example, but it is in most other scenarios and is therefore generally recommended: calling theinitialize()method. This method registers delegates and event handlers so that you can set such properties. If you do not use event handling(as in the next few examples), calling theinitialize()method can be skipped:
label.initialize();
Finally, you can call the methods that get and set the properties that these elements provide. Table 4-2 lists the most commonly used class members. More information about these common methods is provided later in the chapter. In addition, the sections that follow describe methods that are unique to each Atlas control class.
Table 4-2. Standard Atlas methods for setting HTML element properties
| Method | Description |
| get_accessKey() | Retrieves the access key of an element |
| set_accessKey() | Sets the access key of an element |
| get_cssClass() | Retrieves the CSS class of an element |
| set_cssClass() | Sets the CSS class of an element (overwriting existing CSS classes) |
| addCssClass() | Adds a CSS class to an element (leaving existing CSS classes intact) |
| containsCssClass() | Checks whether an element has a certain CSS class |
| removeCssClass() | Removes a specific CSS class from an element |
| toggleCssClass() | Adds the class to an element if it is not already there, otherwise, it removes the class |
| get_enabled() | Retrieves whether an element is enabled (true) or not (false) |
| set_enabled() | Enable (true) or disable (false) an element |
| get_tabIndex() | Retrieves the tab index of an element |
| set_tabIndex() | Sets the tab index of an element |
| get_visibilityMode() | Retrieves thevisibilityCSS style of an element |
| set_visibilityMode() | Sets thevisibilityCSS style of an element |
Table 4-2. Standard Atlas methods for setting HTML element properties (continued)
| Method | Description |
| get_visible() | Retrieves whether an element is visible (true) or not (false) |
| set_visible() | Makes an element visible (true) or invisible (false) |
| focus() | Sets the focus to an element |
| scrollIntoView() | Scrolls the current document to the position of an element |
| getLocation() | Retrieves the coordinates of an element |
| setLocation() | Sets the coordinates of an element |
As you can see, a lot of the relevant style information about an element on a page can be set using the abstraction layer Atlas is providing.
Next: Labels >>
More ASP.NET Articles
More By O'Reilly Media
|
This article is excerpted from chapter four of the book Programming Atlas, written by Christian Wenz (O'Reilly, 2006; ISBN: 0596526725). Check it out today at your favorite bookstore. Buy this book now.
|
|