opitzconsulting / jquery-mobile-angular-adapter

jquery mobile angular adapter
MIT License
517 stars 114 forks source link

Allow (non-jqm-enhanced) input elements (checkbox, radio) without a label #144

Closed marcorinck closed 11 years ago

marcorinck commented 11 years ago

Apparently the adapter forces all input elements of type radio or checkbox to have a label and if label is should not be displayed the styling is not correct.

In the function "checkboxRadioPrecompile" the adapter looks for checkbox and radio inputs and marks them as "ng-non-bindable=true" if they have no label. The result is that they are inaccessible for angular code. Hint: that is very surprising and cost me some hours to find that out!

If they have a label with the class "ui-hidden-accessible" (or ui-hide-label) the adapter will wrap the input and label in a div and adds a jqm-class (ui-checkbox) so that they get (only some) styling of jqm. That leads to a somewhat awkward styling as padding/margin is there as if there were a label.

marcorinck commented 11 years ago

Maybe the same as in #143

tbosch commented 11 years ago

Hi, with the current version, using the css class ui-hidden-accessible produces the same DOM structure as with plain jquery mobile.

However, if there is no label, it's true that the adapter adds the ng-non-bindable. Will remove that one so that the adapter behaves the same way as plain jqm: Checkboxes with no label get wrapped into a <div class="ui-input">, but nothing else.

Tobias