diff --git a/docs/forms/docs-forms.html b/docs/forms/docs-forms.html index e1e57f84..db68b67d 100755 --- a/docs/forms/docs-forms.html +++ b/docs/forms/docs-forms.html @@ -51,7 +51,7 @@ -

Or, if you'd like to prevent auto-initialization without adding attributes to your markup, you can customize the selector that is used for preventing auto-initialization by setting the page plugin's keepNative option (which defaults to "[data-role="none"]. Be sure to configure this option inside an event handler bound to the mobileinit event, so that it applies to the first page as well as subsequent pages that are loaded.

+

Or, if you'd like to prevent auto-initialization without adding attributes to your markup, you can customize the selector that is used for preventing auto-initialization by setting the page plugin's keepNative option (which defaults to [data-role="none"]. Be sure to configure this option inside an event handler bound to the mobileinit event, so that it applies to the first page as well as subsequent pages that are loaded.


 $(document).bind('mobileinit',function(){
 	$.mobile.page.prototype.options.keepNative = "select, input.foo, textarea.bar";
@@ -76,7 +76,43 @@ $(document).bind('mobileinit',function(){
 </div>
 
+

Refreshing form elements

+ +

Every form control -- where applicable -- has a refresh method. Here are some examples:

+

Checkboxes:

+ + +$("input[type='checkbox']").attr("checked",true).checkboxradio("refresh"); + + +

Radios:

+ +$("input[type='radio']").attr("checked",true).checkboxradio("refresh"); + + +

Selects:

+
+var myselect = $("select#foo");
+myselect[0].selectedIndex = 3;
+myselect.selectmenu("refresh");
+
+ +

Sliders:

+ +$("input[type=range]").val(60).slider("refresh"); + + +

Flip switches (they use slider):

+ +
+var myswitch = $("select#bar");
+myswitch[0].selectedIndex = 1;
+myswitch .slider("refresh");
+
+ +

We're considering adding a refresh method to forms to let the framework refresh all the individual elemnts withing but that is a future enhancement.

+ diff --git a/docs/forms/forms-checkboxes.html b/docs/forms/forms-checkboxes.html index d5507ca3..5e18968a 100755 --- a/docs/forms/forms-checkboxes.html +++ b/docs/forms/forms-checkboxes.html @@ -97,6 +97,14 @@ +

Refreshing a checkbox

+ +

If you manipulate a radiobutton via JavaScript, you must call the refresh method on it to update the visual styling. Here is an example:

+ +$("input[type='checkbox']").attr("checked",true).checkboxradio("refresh"); + + + diff --git a/docs/forms/forms-radiobuttons.html b/docs/forms/forms-radiobuttons.html index 8592768b..a0bfe69d 100755 --- a/docs/forms/forms-radiobuttons.html +++ b/docs/forms/forms-radiobuttons.html @@ -113,6 +113,18 @@ --> + + +

Refreshing a radio button

+ +

If you manipulate a radio button via JavaScript, you must call the refresh method on it to update the visual styling. Here is an example:

+ + + +$("input[type='radio']").attr("checked",true).checkboxradio("refresh"); + + + diff --git a/docs/forms/forms-selects.html b/docs/forms/forms-selects.html index 67f1754c..55c1d4f5 100644 --- a/docs/forms/forms-selects.html +++ b/docs/forms/forms-selects.html @@ -369,6 +369,19 @@ $.mobile.selectmenu.prototype.options.hidePlaceholderMenuItems = false; + + + +

Refreshing a select

+ +

If you manipulate a select via JavaScript, you must call the refresh method on it to update the visual styling. Here is an example:

+ +
+var myselect = $("select#foo");
+myselect[0].selectedIndex = 3;
+myselect.selectmenu("refresh");
+
+ diff --git a/docs/forms/forms-slider.html b/docs/forms/forms-slider.html index 56649949..ee58c6e1 100755 --- a/docs/forms/forms-slider.html +++ b/docs/forms/forms-slider.html @@ -50,6 +50,14 @@

Sliders also respond to the keyboards shortcuts. To increase the current value the Right Arrow, Up Arrow, and Page Up keys can be used. To decrease the current value the Left Arrow, Down Arrow, and Page Down keys can be used. To move the slider to its minimum or maximum value use the Home and End keys respectively.

+

Refreshing a slider

+ +

If you manipulate a slider via JavaScript, you must call the refresh method on it to update the visual styling. Here is an example:

+ + +$("input[type=range]").val(60).slider("refresh"); + + diff --git a/docs/forms/forms-switch.html b/docs/forms/forms-switch.html index d2e17fce..850ba58e 100755 --- a/docs/forms/forms-switch.html +++ b/docs/forms/forms-switch.html @@ -45,6 +45,15 @@ +

Refreshing a flip switch

+ +

If you manipulate a flip switch via JavaScript, you must call the refresh method on it to update the visual styling. Here is an example:

+ +
+var myswitch = $("select#bar");
+myswitch[0].selectedIndex = 1;
+myswitch .slider("refresh");
+