Permalink
Browse files

Updated methods and events.

  • Loading branch information...
1 parent 60cdfe4 commit 571aa99e2417e978078e986a0ab4b4bddd948ebd @scottgonzalez committed Sep 27, 2011
Showing with 33 additions and 24 deletions.
  1. +33 −24 how-jquery-ui-works.md
View
@@ -50,32 +50,19 @@ Just like other methods in jQuery, most widget methods return the jQuery object
### Common Methods
-While each widget will have its own set of unique methods available, there are several methods that exist on all widgets.
-
-#### disable
-
-As you might guess, the `disable` method disabled the widget.
-In the case of progressbar, this changes the styling to make the progressbar look disabled.
-
- $( "#elem" ).progressbar( "disable" );
-
-Calling the disable method is equivalent to setting the `disabled` option to `true`.
-
-#### enable
-
-The `enable` method is the opposite of the `disable` method.
-
- $( "#elem" ).progressbar( "enable" );
-
-Calling teh enable method is equivalent to setting the `disabled` option to `false`.
+Each widget will have its own set of methods based on the functionality that the widget provides.
+However, there are a few methods that exist on all widgets.
#### option
-Any option can be changed after initialization through the `option` method.
-For example, we can change the progressbar's value to 30 by calling the option method.
+As we mentioned earlier, we can change options after initialization through the `option` method.
+For example, we can change the progressbar's value to 30 by calling the `option` method.
$( "#elem" ).progressbar( "option", "value", 30 );
+Note that this is different from the previous example where we were calling the `value` method.
+In this example, we're calling the `option` method and saying that we want to change the value option to 30.
+
We can also get the current value for an option.
$( "#elem" ).progressbar( "option", "value" );
@@ -90,14 +77,33 @@ In addition, we can update multiple options at once by passing an object to the
You may have noticed that the `option` method has the same signature as getters and setters in jQuery core, such as `.css()` and `.attr()`.
The only difference is that you have to pass the string "option" as the first parameter.
+#### disable
+
+As you might guess, the `disable` method disabled the widget.
+In the case of progressbar, this changes the styling to make the progressbar look disabled.
+
+ $( "#elem" ).progressbar( "disable" );
+
+Calling the disable method is equivalent to setting the `disabled` option to `true`.
+
+#### enable
+
+The `enable` method is the opposite of the `disable` method.
+
+ $( "#elem" ).progressbar( "enable" );
+
+Calling teh enable method is equivalent to setting the `disabled` option to `false`.
+
#### destroy
If you no longer need the widget, you can destroy it and return back to the original markup.
+This ends the life cycle of the widget.
$( "#elem" ).progressbar( "destroy" );
Once you destroy a widget, you can no longer call any methods on it unless you initialize the widget again.
-If you're removing the element, either directly via `.remove()` or by modifying an ancestor with `.html()` or `.empty()`, the widget will automatically destroy itself.
+If you're removing the element, either directly via `.remove()` or by modifying an ancestor with `.html()` or `.empty()`,
+the widget will automatically destroy itself.
#### widget
@@ -109,7 +115,7 @@ In cases like the progressbar, where there is no generated wrapper, the `widget`
## Events
-All widgets have events associated with their various behaviors.
+All widgets have events associated with their various behaviors to notify you when the state is changing.
For most widgets, when the events are triggered, the names are prefixed with the widget name.
For example, we can bind to progressbar's change event which is triggered whenever the value changes.
@@ -118,12 +124,15 @@ For example, we can bind to progressbar's change event which is triggered whenev
});
Each event has a corresponding callback, which is exposed as an option.
-We could hook into progressbar's change callback instead of binding to the `progressbarchange` event, if we wanted to.
+We could hook into progressbar's `change` callback instead of binding to the `progressbarchange` event, if we wanted to.
$( "#elem" ).progressbar({
change: function() {
alert( "The value has changed!" );
}
});
-While most events will be widget specific, all widgets have a create event.
+### Common Events
+
+While most events will be widget specific, all widgets have a `create` event.
+This event will be triggered immediately after the widget is created.

0 comments on commit 571aa99

Please sign in to comment.