几种Kendo组件实例访问方式(Kendo Tip: Accessing Widget Instances)

原文出处： http://blog.falafel.com/kendo-tip-accessing-widget-instances/

Kendo Tip: Accessing Widget Instances

When a KendoUI widget is created the widget instance is attached directly to its associated DOM element using jQuery’s data method. This allows developers to easily interact with the widget in other parts of their JavaScript code. To grab the widget instance simply use jQuery to select the element with which it was instantiated and call the data method, passing in the name of the widget as the key.

$('#my-grid').data('kendoGrid');

It should be noted that if the jQuery selector returns more than one element, only the Kendo widget associated with the first element will be returned, if one exists.

This is the approach I see used in most demos. However, there are jQuery helpers for every widget in the KendoUI library that allow you to get the widget instance without using the jQuery data method. The helper for every widget is: getKendo[WidgetName].

$('#my-grid').getKendoGrid();

While the examples above do exactly the same thing, I prefer using the helpers since they do not require those ugly string parameters and I believe they make the code easier to read.

If you need to access a widget instance but aren’t exactly sure which widget is associated with an element, you can use Kendo’s widgetInstance method.

kendo.widgetInstance($('#my-widget'));

This is especially useful in scenarios when widgets are added to a page dynamically and it isn’t always clear which widget, if any, was used.

  var element, widget, value;
  element = $('#input-element');
  widget = kendo.widgetInstance(element);

  if (widget) {   
    value = widget.value();
  }

Keep an eye out for more Kendo Tips in future blog posts.