The RadInput controls provide a flexible client-side API. You can easily interact with the controls in the browser using their client-side objects. In addition
to a variety of client-side events, the client-side object model lets you achieve complicated tasks while avoiding unnecessary
post-backs.
Getting the client-side object
All the API methods are accessible via the registered JavaScript objects for each control. A global variable with the same name as the ClientID of the control is
available for each control:
| [ASP.NET] Getting the client-side object |
 Copy Code |
|
<script type="text/javascript">
var dateInput = $find("<%=
RadDateInput1.ClientID %>");
var date = dateInput.get_selectedDate();
</script>
|
Getting a reference to the input area DOM element
The input area of a RadInput control is an HTML <input> element with a client id that is derived from the client id of the entire control. The following
example shows how to get a reference to its DOM element:
| [JavaScript] Getting a reference to the input area DOM element |
Copy Code |
|
var inputElement = $get('<%=RadInput1.ClientID%>' + '_text');
|
Getting the value of the input control
Each client-side object has a number of methods for getting the value of the control:
| Method |
Return Type |
Description |
| get_value(), set_value() |
RadNumericTextBox: number
All other input controls: string |
Gets or sets the value of the input control. |
| get_textBoxValue(), set_textBoxValue() |
string |
Gets or sets the value the user typed into the input control. It is not assigned as the value of the input control if it contains an error. |
| get_editValue(), set_editValue() |
string |
Gets or sets the value of the input control as it is formatted when the control has focus. |
| get_displayValue(), set_displayValue() |
string |
Gets or sets the value of the input control as it is formatted when the control does not have focus. |
Changing the appearance style of RadInput controls on the client
Because the RadInput controls have their own style mechanism, you can change some of the appearance styles so that they are preserved when the control
state is changed (i.e. when it is focused, hovered etc.). Below is a sample of how to change the EnabledStyle of a RadTextBox instance using the
OnLoad client-side event hander.
| [ASP.NET] Setting the style properties client-side |
Copy Code |
|
<script type="text/javascript" >
function Load(sender)
{
sender.get_styles().EnabledStyle[0] += "background-color: lemonchiffon;";
sender.updateCssClass();
}
</script >
<telerik:RadTextBox ID="RadTextBox1"
runat="server">
<ClientEvents OnLoad="Load" />
</telerik:RadTextBox>
|
See Also