Kendo UI for jQuery Tutorial: DOM element structure widget

[ Kendo UI for jQuery Download the latest trial version ]

Kendo UI provides the latest Kendo UI for jQuery, Kendo UI for Angular, Kendo UI Support for React and Kendo UI Support for Vue four controls. Kendo UI for jQuery is to create a modern Web applications most complete UI library.

All Web Kendo UI widgets are encapsulated and maintains a reference to the elements of the DOM elements, and all the mixed Kendo UI widgets to retain only the elements of a reference element of the DOM.

element is an element to initialize widget. The widget, elements may be visible (e.g., in the AutoComplete, Calendar and DatePicker in), and may be hidden (e.g., in the DropDownList and Upload). Initialization statement also returns a reference to this element. Get widgets from the widget element object reference is a relatively rare condition, but may be helpful in certain situations, especially when you want to avoid hard-coding ID in jQuery selector.

element is the outermost wrapper, which is part of the widget. The widgets and scene, the wrapper may be the same element. For example, if the <div> initialize the Grid, the two matched reference; if the <table> the Grid initialization, points to the element <table>, while pointing packaging <div>. You may need to refer to a widget wrapper or CSS DOM during operation. For example, to hide the widget, you need to hide the wrapper. Hidden elements may be partially hidden widgets or not hide it. wrapper is the most suitable additional custom CSS HTML node class.

The following example demonstrates how to use the reference element and the wrapper.

<div id="myWindow">...window content...</div>
  <script>// Initialize the widget which also returns the widget element.var winElement1 = $("#myWindow").kendoWindow( { /*...*/ } ); // Returns div#myWindow as a jQuery object.var winObject = $("#myWindow").data("kendoWindow");
// Other ways to get the widget element.
  var winElement2 = $("#myWindow");
  var winElement3 = $("#myWindow").data("kendoWindow").element; // Returns div#myWindow as a jQuery object.
  var winElement4 = winObject.element;
// Get the wrapper.
  var winWrapper1 = $("#myWindow").data("kendoWindow").wrapper; // Returns div.k-window as a jQuery object.
  var winWrapper2 = winObject.wrapper; // returns div.k-window as a jQuery object
  </script>

Kendo UI R2 2019 SP1 new release, please stay tuned to the latest developments Telerik Chinese net!

Scan attention Hui poly IT micro-channel public number, timely access to the latest developments and the latest information

Hui poly IT micro-channel public number

Guess you like

Origin www.cnblogs.com/AABBbaby/p/11412162.html