Страница динамического просмотра списков с деталями (Jquery Mobile) - PullRequest
Новая
       18

Страница динамического просмотра списков с деталями (Jquery Mobile)

1 голос
/ 16 сентября 2011

Я успешно перечислил свои данные из базы данных mysql в JQM.

Я хочу связать элемент списка с его деталями.

Поэтому при нажатии на списокотображается новая страница с данными из списка.

Я не знаю, как это сделать

Вот что у меня сейчас: но ссылка у меня не работает, думаю, я что-то упустил

вот ссылка на js fiddle 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>

Что мне сделать, чтобы получить список, связанный с его данными на другой html-странице.

1 Ответ

0 голосов
/ 31 августа 2012

У меня была очень похожая проблема, и я нашел исправление с помощью простого плагина. Он называется jqm.page.params.js и может быть найден здесь . Реализация была очень легкой. Добавил файл плагина в мой корневой каталог, а затем включил его внизу моей страницы index.html.

В вашем js-файле вы просто хотите разместить 

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

вверху вашего события beforepageshow для захвата переменных, привязанных к ссылке. Замените «цвет» переменными, которые вы ищете.

...