What is the use of data-role="fieldcontain"?

Question

I just discovered that text inputs within a div with data-role="fieldcontain" don't expand to the 100%, but if you place a text input outside of a fieldcontain it expands to the fullest. This is a bug that they are fixing, but meanwhile...

So I was wondering what is the use of that data-role="fieldcontain" in the first place? Why to put it? I saw it on the documents and I just put it in my html, but what is the use of putting it?

Thanks!

Answer 1

Looks like it's a Field Container for Grouping and Display

• http://jquerymobile.com/demos/1.1.1/docs/api/data-attributes.html

Field container
Container with data-role="fieldcontain" wrapped around label/form element pair


Controlgroup
DIV or FIELDSET container with data-role="controlgroup". Visually integrate multiple button-styled inputs of a single type (checkboxes, link-based buttons, radio buttons, selects) into a group. For grouping form checkboxes and radio buttons, the fieldset container is recommended inside a div container with the data-role="fieldcontain", to improve label styling.

data-mini true | false - Compact sized version for all items in the controlgroup
data-type horizontal | vertical - For horizontal or vertical item alignment

Answer 2

As of jquerymobile 1.4 data-role="fieldcontain" is deprecated!

use class="ui-field-contain" instead.

see release notes http://jquerymobile.com/changelog/1.4.0/