Client-side Progamming Overview
This help article lists the RadGauge's public client-side methods that let you access and modify the control's height, width, value, etc. and shows how to reference and use the RadGauge client-side object (Examples 1-2).
RadGauge for ASP.NET AJAX is built on top of the Kendo UI Data Visualization Radial Gauge Widget and Linear Gauge Widget. Thus, it exposes the client-side API and methods offered by the Radial Gauge widget and Linear Gauge widget and mainly provides a wrapper and API for working with the gauge on the server (programmatic creation, declaring in the markup).
Public Methods
Name | Description |
---|---|
get_height | Gets the height of the control. |
get_value | Gets the value of the control. |
get_width | Gets the width of the control. |
repaint | Causes the control to repaint (re-render). |
set_height | Sets the height of the control. |
set_value | Sets the value of the control. Does nothing if an invalid argument is supplied. If the passed value is outside of the range of the gauge the value is set to the min/max. |
set_width | Sets the width of the control. |
get_kendoWidget | Gets a reference to the Kendo Gauge widget. |
RadGauge for ASP.NET AJAX, through the Kendo widgets, exposes the Kendo Linear Gauge client-side methods and Kendo Radial Gauge client-side methods.
Get Client-side Object Reference
There are two ways to get a reference to the Kendo Gauge widgets in order to use their API:
- Use the get_kendoWidget method the RadGauge client-side object exposes. You can get the RadGauge object through the $find() MS AJAX method.Example 1: Get the Kendo Linear and Radial objects through the get_kendoWidget method.
//Reference Kendo Radial Gauge widget:
var radRadialGaugeObject = $find("<%=RadRadialGauge1.ClientID %>"); //the standard script control object
var kendoRadialGauge = radRadialGaugeObject.get_kendoWidget(); //the Kendo widget
//Reference Kendo Linear Gauge widget:
var radLinearGaugeObject = $find("<%=RadLinearGauge1.ClientID %>"); //the standard script control object
var kendoLinearGauge = radLinearGaugeObject.get_kendoWidget(); //the Kendo widget
- Use the standard Kendo approach for getting the widget through the data-attributes of the DOM element:Example 2: Get the Kendo Linear and Radial objects through the data attribute of the DOM object.
//Reference Kendo Radial Gauge widget:
var kendoRadialGauge = $telerik.$("#<%=RadRadialGauge1.ClientID %>").data("kendoRadialGauge");//the jQuery selector must get the Gauge wrapping div element
//Reference Kendo Linear Gauge widget:
var kendoLinearGauge = $telerik.$("#<%=RadLinearGauge1.ClientID %>").data("kendoLinearGauge");//the jQuery selector must get the Gauge wrapping div element
RadGauge is an IScriptControl based on MS AJAX and so it instantiates its client-side object (i.e., the Kendo Gauge) during the
Sys.Application.Init
event. This means that the earliest event in which you can reference the gauge widgets is Sys.Application.Load.