The best jQuery UI widgets method call Tutorial In 2024, In this tutorial you can learn jQuery UI widgets method call
Widget (Widget) by member libraries (Widget Factory) using the method to change their status and perform actions after initialization is created. There are two ways to call widgets method - through member libraries (Widget Factory) to create plug-ins, or by the method of the element instance of an object on the call.
Widgets plug-call method, the method name as a string passed. For example, click here to see, how to call dialog (dialog) widget close()
method .
$( ".selector" ).dialog( "close" );
If the method requires parameters, passed to the plug-in as an additional parameter. Click here to see, how to call dialog (dialog) of option()
method .
$( ".selector" ).dialog( "option", "height" );
This returns the dialog (dialog) in height
option values.
Each instance of each widget is using jQuery.data()
is stored in the element. In order to retrieve an instance of an object, use the full name of the widget to call as a key jQuery.data()
. As specific examples shown below.
var dialog = $( ".selector" ).data( "ui-dialog" );
After you reference an instance of an object, you can call the method directly above.
var dialog = $( ".selector" ).data( "ui-dialog" ); dialog.close();
In jQuery UI 1.11, the new instance()
method will make this process easier.
$( ".selector" ).dialog( "instance" ).close();
Most of the methods called by the widget plugin will return a jQuery
object, so methods can be invoked through additional jQuery methods link. When called on the instance, it returns undefined
. As specific examples shown below.
var dialog = $( ".selector" ).dialog(); // Instance invocation - returns undefined dialog.data( "ui-dialog" ).close(); // Plugin invocation - returns a jQuery object dialog.dialog( "close" ); // Therefore, plugin method invocation makes it possible to // chain method calls with other jQuery functions dialog.dialog( "close" ) .css( "color", "red" );
Exceptionally, those methods return information about the widget. For example dialog (dialog) of isOpen()
method .
$( ".selector" ) .dialog( "isOpen" ) // This will throw a TypeError .css( "color", "red" );
This results in a TypeError
error because isOpen()
returns a Boolean value, not a jQuery object.