FM / jquery-nestable

/home2/dakshskx/public_html/assets/admin/plugins/jquery-nestable/

/home2/dakshskx/public_html/assets/admin/plugins/jquery-nestable

Name	Size	Mode	Actions
index.html	7245	0644	edit dl rm
jquery.nestable.css	2999	0644	edit dl rm
jquery.nestable.js	17966	0644	edit dl rm
README.md	3460	0644	edit dl rm

Edit: /home2/dakshskx/public_html/assets/admin/plugins/jquery-nestable/index.html (7245B)

<!DOCTYPE html>




 <html lang="en"> 
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
    <title>Nestable</title>
    <style type="text/css">

.cf:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .cf { zoom: 1; }
*:first-child+html .cf { zoom: 1; }

html { margin: 0; padding: 0; }
body { font-size: 100%; margin: 0; padding: 1.75em; font-family: 'Helvetica Neue', Arial, sans-serif; }

h1 { font-size: 1.75em; margin: 0 0 0.6em 0; }

a { color: #2996cc; }
a:hover { text-decoration: none; }

p { line-height: 1.5em; }
.small { color: #666; font-size: 0.875em; }
.large { font-size: 1.25em; }

</style>
</head>
<body>

<h1>Nestable</h1>

<p>Drag &amp; drop hierarchical list with mouse and touch compatibility (jQuery plugin)</p>

<p><strong><a href="https://github.com/dbushell/Nestable">Code on GitHub</a></strong></p>

<menu id="nestable-menu">
        <button type="button" data-action="expand-all">Expand All</button>
        <button type="button" data-action="collapse-all">Collapse All</button>
    </menu>

</div>

<p><strong>Serialised Output (per list)</strong></p>

<p><strong>Draggable Handles</strong></p>

<p>If you're clever with your CSS and markup this can be achieved without any JavaScript changes.</p>

</div>

<p class="small">Copyright &copy; <a href="http://dbushell.com/">David Bushell</a> | Made for <a href="http://www.browserlondon.com/">Browser</a></p>

$(document).ready(function()
{

// activate Nestable for list 1
    $('#nestable').nestable({
        group: 1
    })
    .on('change', updateOutput);
    
    // activate Nestable for list 2
    $('#nestable2').nestable({
        group: 1
    })
    .on('change', updateOutput);

// output initial serialised data
    updateOutput($('#nestable').data('output', $('#nestable-output')));
    updateOutput($('#nestable2').data('output', $('#nestable2-output')));

$('#nestable-menu').on('click', function(e)
    {
        var target = $(e.target),
            action = target.data('action');
        if (action === 'expand-all') {
            $('.dd').nestable('expandAll');
        }
        if (action === 'collapse-all') {
            $('.dd').nestable('collapseAll');
        }
    });

$('#nestable3').nestable();

});
</script>
</body>
</html>

Nestable

Drag & drop hierarchical list with mouse and touch compatibility (jQuery plugin)

Code on GitHub

Item 1
Item 2
1. Item 3
2. Item 4
3. Item 5
  1. Item 6
  2. Item 7
  3. Item 8
4. Item 9
5. Item 10
Item 11
Item 12

Item 13
Item 14
Item 15
1. Item 16
2. Item 17
3. Item 18

Serialised Output (per list)

Draggable Handles

If you're clever with your CSS and markup this can be achieved without any JavaScript changes.

Drag
Item 13
Drag
Item 14
Drag
Item 15
1. Drag
  Item 16
2. Drag
  Item 17
3. Drag
  Item 18