2011-09-16 9 views
1

JQMのmysqlデータベース からのデータをリストアップすることに成功しました。動的リストビューの詳細ページ(Jquery Mobile)

リスト項目をその詳細にリンクしたいと考えています。

リストにクリックがあると、リストのデータを含む新しいページが表示されます。

私が行う方法を知ってはいけない、それ

相続人は私が今持っているもの:しかし、リンク、私は何かが欠けています推測し、イマイチの作業を持っています。

HERESにjsのフィドルのリンク私は別のHTMLページ上のデータへのリンクリストを得るために行う何http://jsfiddle.net/8WU39/16/

<script type= text/javascript> 
    $('#seyzListPage').live('pageshow', function(){ 
     $.ajax({ 
     url: "data.php", 
     dataType: 'json', 

      success: function(json_results){ 
      listItems = $('#seyzList').find('ul'); 
      $.each(json_results.rows, function(key) { 
       html = '<li <h3><a href="index1.html?id=' + [json_results.rows[key].airp_id] +'"rel="external">'+json_results.rows[key].airport_code+'</h3>'; 
       html += '<p><br> Aiport name: '+json_results.rows[key].airport_name+'</p></a></li>'; 


      listItems.append(html); 
      }); 
      // Need to refresh list after AJAX call 
       $('#seyzList ul').listview('refresh'); 
    $.mobile.pageLoading(true);  
     } 
    }); 
}); 
    </script> 

<div data-role="page" id="seyzListPage"> 
    <div data-role="header" id="header">  
    <h1>Airports</h1>  
    </div> 

    <div data-role="content" id="seyzList"> 
<ul data-role="listview" data-inset="true" data-filter="true"></ul> 


    </div> 

    <div data-role="footer" data-postion="fixed"> 
    <h3>Footer</h3> 
    </div> 


    </div> 

答えて

0

私は非常に似た問題を抱えており、簡単なプラグインで修正を見つけました。 jqm.page.params.jsと呼ばれ、hereとなります。実装は非常に簡単でした。プラグインファイルをルートディレクトリに追加し、index.htmlページの一番下に追加しました。あなたのjsファイルで

、あなたがしてちょうどリンクに上のタック変数をキャプチャするためにあなたのbeforepageshowイベントの上部に

if ($.mobile.pageData && $.mobile.pageData.color){ 
    var color = $.mobile.pageData.color; 
} 

を配置します。探している変数に 'color'を置き換えます。

関連する問題