jquery mobile listview data only display when touch on the screen in Android (Samsung Galaxy Note)

jquery mobile listview data only display when touch on the screen in Android (Samsung Galaxy Note)

Hi Guys,

I encountered an extreme weird problem on Android device where the data in listview will only display when i touch on the screen. I am using jqm 1.2, phonegap 2.1, eclipse juno 4.2.1, and samsung galaxy note. Below are the code:

  1. <div data-role="page" id="sent_receipt" data-title="Sent Receipt" data-dom-cache="true">

  3. <div data-role="header" class="header" data-position="fixed" data-tap-toggle="false">
  4.             <a id="a_sent_receipt" href="#search_receipt_option" data-icon="arrow-l" class="ui-btn-left" data-iconpos="notext" data-theme="d" data-direction="reverse"></a>
  5. <h2>Sent Receipt</h2>
  6. <a id="refresh" href="#" data-icon="refresh" class="ui-btn-right" data-iconpos="notext" data-theme="d"></a>
  7. </div><!-- /header -->

  9. <div data-role="content" data-iscroll>

  11. <ul data-role="listview" id="ul_no_record">
  12. </ul>
  14. <ul data-role="listview" id="ul_sent_receipt_list_today">
  15. </ul>
  17. <ul data-role="listview" id="ul_sent_receipt_list_yesterday">
  18. </ul>
  20. <ul data-role="listview" id="ul_sent_receipt_list_this_week">
  21. </ul>
  23. <ul data-role="listview" id="ul_sent_receipt_list_last_week">
  24. </ul>
  26. </div><!-- /content -->

  28. <div data-role="footer" data-position="fixed" data-tap-toggle="false">
  29. </div><!-- /footer -->
  30. </div><!-- /page -->



  34. $.ajax({
  35. type: 'POST',
  36. url: myApp.getHost() + myApp.getReceiptsUrl(),
  37. cache: false,
  38. data: {'email':myApp.getStoreValue('email')},
  39. dataType: 'json',
  40. timeout: myApp.getRequestTimeout(),
  41. beforeSend: function(x) {
  42. if (x && x.overrideMimeType) {
  43. x.overrideMimeType('application/json;charset=UTF-8');
  44. }
  45. }, 
  46. success: function(res) {

  48. if(res.end === undefined) {
  49. // some populated data goes here
  50. ul.append('<li id="li_show_more" data-icon="false"></li>').listview('refresh').css('display','block');
  52. } else {
  54. ul.listview('refresh').css('display','block');
  56. }


  60. },
  61. error: function(jqXHR, exception) {

  64. },
  65. complete: function(res) {
  68. }

Appreciate anyone can help here. thanks !

regards,
Mark