Form Plugin Methods

Home

Form methods reference

After jQuery Mobile auto-enhances form controls into custom controls, you can manipulate many of their properties via plugin methods. The currently available methods are listed below. Check Github for updates - we're working on complete coverage.

Selectmenu

open open a closed select menu

$('select').selectmenu('open');			
			
close close an open select menu

$('select').selectmenu('close');			
			
refresh: Update the custom menu to reflect the native select element's value.

If the number of options in the select are different than the number of items in the custom menu, it'll rebuild the custom menu. Also, if you pass a true argument you can force the rebuild to happen.


//refresh value			
$('select').selectmenu('refresh');

//refresh and force rebuild
$('select').selectmenu('refresh', true);
			
enable: enable a disabled select.

$('select').selectmenu('enable');			
			
disable: disable a select.

$('select').selectmenu('disable');			
			

Textinput

enable: enable a disabled textinput/textarea.

$('input').textinput('enable');			
			
disable: disable a textinput/textarea.

$('textarea').textinput('disable');			
			

checkboxradio

enable: enable a disabled checkboxradio.

$('input').checkboxradio('enable');			
			
disable: disable a checkboxradio.

$('input').checkboxradio('disable');			
			
refresh: refresh a checkboxradio's value.

$('input').checkboxradio('refresh');			
			

Slider

enable: enable a disabled slider.

$('input').slider('enable');			
			
disable: disable a slider.

$('input').slider('disable');			
			
refresh: refresh a slider's value.

$('input').slider('refresh');			
			

Form buttons

enable: enable a disabled button.

$('input').button('enable');			
			
disable: disable a slider.

$('input').button('disable');			
			

Degraded Form Input Types

jQuery Mobile degrades several HTML5 input types back to type=text, or type=number after adding enhanced controls. For example, inputs with a type of range are enhanced with a custom slider control, and their type is set to number to offer a usable form input alongside that slider. Inputs with a type of search are degraded back to type=text after we add our own themable search input styling.

The page plugin contains a list of input types that are set to either true which means they'll degrade to type=text, false which means they'll be left alone, or a string such as "number", which means they'll be converted to that type (such as the case of type=range).

You can configure which types are changed via the page plugin's degradeInputs option, which can be manipulated externally via $.mobile.page.prototype.options.degradeInputs, which has properties: color, date, datetime, "datetime-local", email, month, number, range, search, tel, time, url, and week. Be sure to configure this 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.