Why do I have to call $(":button").button(); to enable JQuery UI Theme?

5.5k Views Asked by At

I am still new to JQuery and JQuery UI Theme. I have managed to develop my own theme, and to apply it on a simple test page with buttons. I read the documentation, and I could not find where it says that I should explicitly call $(":button").button(); to apply it.

If I don't do this, the theme is not applied. So why do I have to do this explicitly? Or if this is expected from me, does anyone have a generic script to apply the theme automatically on all items? Thanks.

EDIT

Reading answers and comments, some people imply that application of UI Theme is automatic, but others say it should be applied manually. A test on the delivered test HTML page seem to indicate that theme must be applied manually.

3

There are 3 best solutions below

0
On BEST ANSWER

If you look at the demos, the button styles can be applied to other elements as well, such as checkboxes, radio buttons and anchors. jQuery UI thinks it is better to let you specify which elements should have that particular style applied than to try to guess, especially since specifying the elements is typically a one-liner: $(foo).button();

0
On

The reason you have to specify this explicitly is because not everyone using the library might want to style all their buttons as jQuery UI buttons. It's generally considered desirable to separate "mechanism" (which jQuery UI provides), from "policy" (which you get to decide); and jQuery is excellent at letting you define policy in a concise way anyway.

3
On

The reason you have to call the button function, is so that jQuery UI can add all of its specialized classes and attributes to the button.

If you start off with a button like this:

<button type="button">A button element</button>

It will be replaced with this:

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">A button element</span></button>