Home/ Questions/Q 7641881
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T09:02:34+00:00

all. I have a ajax and jquery-mobile loading question. api = update: -> console.log

  • 0

all. I have a ajax and jquery-mobile loading question.

  api = 
    update: ->
    console.log "updated"
    $.ajax
      dataType: "jsonp"
      url: "http://localhost:3004/videos.json"
      success: (data) =>
        if data
          data.forEach (elem) =>
            video_id = elem.video_id
            embed_id = elem._id
            $("#play_list").append "
            <ul data-role='listview' data-theme='a'>
              <li>hello</li>
              </ul>
             "
   t = api.update()

And I try to insert this code into html file.

  <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet"/>
  <link href="bootstrap/css/bootstrap.responsive.css" rel="stylesheet"/>
  <body>
   <div id="play_list"></div>
  </body>
<script>
 head.js(
 "lib/jquery.js",
 "lib/jquery.mobile-1.0.1.min.js",
 "http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.1.6/underscore-min.js", 
 "http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js", 
 "http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.1/backbone-min.js",
  "app.js"
 );
</script>
</html>

Outputted html code is 

<ul data-role='listview' data-theme='a'>
 <li>hello</li>
</ul>

But it doesn’t formatted by jquery-mobile style . It just output normal html style.
I want to output like following picture http://brooky.cc/wp-content/uploads/2011/04/list_view1.png

Please help.

Thanks in advance.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    From the fine manual:

    Calling the listview plugin

    You can directly call the listview plugin on any selector, just like any jQuery plugin:

    $('#mylist').listview();

    The library automatically calls listview() on all the lists that are in the page when things start up, AFAIK it basically does this:

    $('[data-role=listview]').listview();

    If you add a new list, you just need to .listview() it:

    success: (data) =>
  if data
    data.forEach (elem) =>
      video_id = elem.video_id
      embed_id = elem._id
      ul = $("
        <ul data-role='listview' data-theme='a'>
          <li>hello</li>
        </ul>
      ")
      $("#play_list").append ul
      ul.listview()

    Demo: http://jsfiddle.net/ambiguous/pMF4G/

    You could also add them all at once:

    success: (data) =>
  if data
    uls = $()
    data.forEach (elem) =>
      video_id = elem.video_id
      embed_id = elem._id
      uls = uls.push("
        <ul data-role='listview' data-theme='a'>
          <li>hello</li>
        </ul>
      ")
    $("#play_list").append uls
    uls.listview()

    Demo: http://jsfiddle.net/ambiguous/BdqeC/

    • 0