arschmitz/jquery-mobile-nestedlists

Adds options for nested lists to jQuery mobile

jQuery-mobile-nestedlists

this is an extension to the listview widget which restores jQuery mobile 1.3 nested listviews in jQuery mobile 1.4

to enable this behavior simply include the widget simply include this extension

to turn it off for a specific list set the childPages option to false;

Demo at https://rawgithub.com/arschmitz/jquery-mobile-nestedlists/master/index.html

jquery-mobile-nestedlists's Issues

Dynamically created list is expanded by default

Dynamically created list is expanded by default

I'm creating a large listview dynamically by creating the list (via data from an ajax call) in a variable (called 'output') and using $('#mylistview').append(output).listview('refresh'); to display the list. This was working fine before nested lists were deprecated.

With nestedlists.js it creates the list ok but all of the child pages are expanded out within the listview when it is displayed (rather than just the parent list items). Clicking on one of the list items correctly shows the child page. On returning to the list (using the Back button) the listview is no longer expanded and looks fine. So, there is a problem on the initial view of the list which shows all the child pages expanded out.

I have been using an older version of this nestedlists.js script.

I tried using the latest version and still had the same problem, and in addition the list items were no longer clickable. Or were very slow to click. So I reverted to the older version.

I am using jquery mobile 1.4.2 with jquery 1.11.0 and phonegap 3.3.0.

My list definition is:

Going back is not working after level 2

Hi,

I have a nested-list created dynamically but I'm getting some problems navigating it. It loads correctly, and when I click on one element I go to the next level and in the bar appears '#ui-id-1'. Now, if I press the 'BACK' button it works fine (and it deletes the '#ui-id-1') but if I click again to go deeper '#ui-id-2' appears on the bar and if I click on the 'BACK' button it changes it for '#ui-id-1' but it doesn't load the previous level, and if I click again it goes to the first level, not the previous one.

I have checked with a simple list from: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_nestedlists2 and doesn't work.

Thanks in advance

Initialize nested list

Hi,

I have a little problem. I'm loading a list from a html file with this:

    < div data-role="content" id="tree view" > <!-- Where the menu is loaded --> </ div>

    < script type="text/javascript">
       $("#treeview").load("data/menu.html");
    < /script >

And inside the menu.html I have this script to initialize:

< ul data-role="listview">
< li> option1
< ul>
< li>option1.1
< /ul>
< /li>
< script>
$(function () {
$("ul").listview();
});
< /script>
< /ul>

But it is showing the regular list from JQM and not yours. is there something like $("ul").nestedlist() ??

Thanks in advance

Dynamically created list not clickable and showing expanded list

In the example below, using the latest version of nestedlists.js the list items are difficult to click (you have to click the bottom of the list item it seems), and they display the nested list items all the time.

http://jsbin.com/nogil/2/edit

In the previous version of nestedlists.js the list items were clickable and only displayed nested items on the first view of the list (thereafter it displayed correctly). So the newest version seems to have more problems than the older version when created dynamically.