Skip to content

Widget: Document how to retrieve a widget's instance and how to tell whe... #106

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
tjvantoll merged 4 commits into from
Feb 21, 2013
Merged

Widget: Document how to retrieve a widget's instance and how to tell whe... #106

Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
97807c1
Widget: Document how to retrieve a widget's instance and how to tell …
tjvantoll Feb 17, 2013
da3fe63
Spacing consistency.
tjvantoll Feb 17, 2013
a8d50df
Widget: Give example of getting all elements that are instances of th…
tjvantoll Feb 20, 2013
4798d90
Updating link to the :data selector.
tjvantoll Feb 21, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions entries/jQuery.widget.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,27 @@
</code></pre>

<p>All widgets have a <code>create</code> event which is triggered upon instantiation.</p>

<h3>Instance</h3>

<p>The widget's instance is stored using <a href="http://api.jquery.com/jQuery.data/"><code>jQuery.data()</code></a> with the widget's full name as the key. Therefore, you can use the following to retrieve the progressbar widget's instance object from the element.</p>

<pre><code>
$( "#elem" ).data( "ui-progressbar" );
</code></pre>

<p>Whether an element has a given widget bound to it can be determined using the <a href="data-selector"><code>:data</code></a> selector.</p>
Copy link
Member

@scottgonzalez scottgonzalez Feb 20, 2013

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

<a href="/data-selector/">


<pre><code>
$( "#elem" ).is( ":data( 'ui-progressbar' )" ); // true
Copy link
Member

@scottgonzalez scottgonzalez Feb 19, 2013

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had no idea you could quote the name. You learn something new every day!

$( "#elem" ).is( ":data( 'ui-draggable' )" ); //false
</code></pre>

<p>You can also use <code>:data</code> to get a list of all elements that are instances of a given widget.</p>

<pre><code>
$( ":data( 'ui-progressbar' )" );
</code></pre>
</longdesc>
<category slug="utilities"/>
</entry>
Expand Down