Dynamically changing button data-icon in NavBar?

1 posts, 0 answers
  1. Joon
    Joon avatar
    30 posts
    Member since:
    Aug 2012

    Posted 24 May 2012 Link to this post

    Following is my header for a view and what I want to achieve is to when I click on the 'but_add_to_favorites' button, the button changes its data-icon (initially set to 'favorites'), say, to 'trash'. 

    <div data-role="view" id="business_info" data-title="Business" data-show="BusinessInfo_Init" data-layout="mainLayout">
            <header data-role="header">
                <div data-role="navbar" id="business_navbar">
                    <a class="nav-button" data-align="left" data-role="backbutton">Back</a>
                    <span data-role="view-title">Business</span>
                    <a id="btn_add_to_favorites" data-role="button" data-align="right" data-icon="favorites" onclick="favorites_clicked()"></a>

    function favorites_clicked() {
                $("#btn_add_to_favorites").attr("data-icon", "trash");

    as it shown me the 'hm' alert, this fires ok but nothing happens with my attempt to change the data-icon attribute to 'trash'.

    Any guidance would be much appreciated.


    John C 
Back to Top