0

Im using $.getJSON to fetch data from the server side to populate the data in my jquery mobile app. The problem Im having is that the json result that I fetch contains HTML tags. When I append this data to the div in app, the HTML tags are retained as they are Looks like this now

var menDet;
menDet="<ul><li>Offer
<ul>"+data+"</ul></li><ul>";

//data contains a <p> tag from the server side fetched data

$("#menu").html($(menDet));
$("#menu").listview("refresh");

From the Inspect element window, I just noticed the data value is getting wrapped within quotes and thats preventing the HTML from being applied to the HTML tags within the quotes !

Any ideas on how I can add them without them being wrapped in quotes?

Shankar ARUL
  • 12,642
  • 11
  • 68
  • 69

2 Answers2

0

You can wrap the string in $() and get a jQuery object which constructs all of the HTML elements.

Example

You can test it here with jsFiddle.

HTML

<html>
    <div id="foo">
    </div>
</html>​

Javascript

var s = '<span><b>Hello</b> World</span>';
$('#foo').append($(s));

Result

<html>
    <div id="foo">
        <span>
            <b>Hello</b> World
        </span>
    </div>
</html>
Ian Bishop
  • 5,185
  • 3
  • 26
  • 37
0

If you are getting the data perfectly from server in proper format as you required for appending then you can use

$("#yourlistview").listview('refresh'); or 

$("#yourlistview").listview('refresh', true);

Check the following link

JQM (jQueryMobile) problem with AJAX content listview('refresh') not working

Community
  • 1
  • 1
Reddy Prasad
  • 251
  • 2
  • 6