Search code examples
jquery-mobilepage-refresh

JQuery Mobile Page Not Refreshing


I Did do my home work but i cannot get it to work.The Button Styles Are Not Refreshing Please Help.

        <div id="qpage" data-role="page">
        <div data-role="header">
            <a id="exit-quiz" data-role="button" data-icon="arrow-l" >Exit</a>
            <h1 id="ques-title">#ques-title</h1></div>
        <div data-role="content">
            <div class="ui-bar-a" id="ques-timer">
                #ques-timer
            </div>
            <div id="question"><h3>#Question</h3></div>
            <div class=".button-set" data-role="controlgroup" id="answerbox">
                <a data-role="button" id="answer_1">#answer_1</a>
                <a data-role="button" id="answer_2">#answer_2</a>
                <a data-role="button" id="answer_3">#answer_3</a>
                <a data-role="button" id="answer_4">#answer_4</a>
            </div>
            <div id="explanation">

            </div>
        </div>
        <div data-role="footer"><h2>Copyright Kaveen</h2></div>
    </div>

This is Th Javascript I wrote

            $("#subject1").bind('click',function(){
            var json = $.get("test.json",function(data){
                $("#question").html(data.question);
                $("#answer_1").html(data.mcq_1);
                $("#answer_2").html(data.mcq_2);
                $("#answer_3").html(data.mcq_3);
                $("#answer_4").html(data.mcq_4);
            });  

i did try $( "div[data-role=page]" ).page( "destroy" ).page(); But it wont work Plese Help Me Thank you. JSFIDDLE http://jsfiddle.net/xRTCu/


Solution

  • Try this, it should work:

    $("#answer_1").button("refresh");
    

    If that is also not working, try this

    $("#answer_1").buttonMarkup();
    

    EDIT: jsfiddle updated http://jsfiddle.net/androdify/xRTCu/4/ Use this:

     $("#answer_1 .ui-btn-text").text(data.mcq_1);
    

    Why? Because jquery mobile adds a span around the button which has class="ui-btn-text"