CODEWITHSUNDEEP
jquery-mobile
Steve Awsd
Steve Awsd

Reputation: 55

Change icon of button jQuery Mobile

I'm trying to change an icon of a button to another, but is not working.

I have:

<a id="login" href="login.html" data-role="button" data-icon="user" data-iconpos="top">Login</a>

And I did:

$('#login').data('icon', 'user_highlight');
$('#login').button("refresh");

But it did not work. How can I solve?

Upvotes: 2

Views: 3998

Answers (3)

tyler.frankenstein
tyler.frankenstein

Reputation: 2344

The buttonMarkup approach just would not work for me, but a manual approach did work:

$('#login').removeClass('ui-icon-foo').addClass('ui-icon-bar').trigger('refresh');

Upvotes: 0

Atilla Ozgur
Atilla Ozgur

Reputation: 14701

See this answer. Basically you use buttonMarkup.

 $('#login').buttonMarkup({ icon: "star" });

see working example fiddle

Upvotes: 5

Jack
Jack

Reputation: 10993

Try placing the code to change the icon in the pageshow event

    $('#page2').bind('pageshow', function () {
        $('#login').data('icon', 'user_highlight');
        try {
            $('#login').button("refresh");
        } catch (e) {
            $('#login').button();
        }
    });

Upvotes: -2

Related Questions