Tengo un problema con nestable.js y tal vez estoy usando la devolución de llamada incorrectamente. A continuación se muestra mi código actual y estoy cargando el JSON desde la variable php $primary_menu_json que se pasa a la función. Crea el menú sin problemas y puedo mover los elementos de mi menú que se crean a partir de JSON sin problemas, pero no actualiza mi área de texto oculta (#nestableOutput) en la devolución de llamada.

La forma en que entiendo la devolución de llamada de la documentación es que se activa cuando los elementos se reordenan o anidan. En mi opinión, este sería el lugar para actualizar el área de texto oculta cuando se suelta un elemento. Tal vez me equivoque en este pensamiento. ¿Alguna ayuda?

 $(document).ready(function () { function nestableJSON(jsonArray, root) { if (typeof root === 'undefined') { root = $('body'); } var $div = $('<div id="nestable02a" class="dd" data-plugin="nestable"><ol class="dd-list dd3-list"></ol></div>'); root.append($div); for(var i = 0; i < jsonArray.length; i++) { var $li = $("<li class='dd-item dd-item-alt' id='item-" + jsonArray[i].id + "' data-id='" + jsonArray[i].id + "' data-title='" + jsonArray[i].title + "'><div class='dd-handle'></div><div class='dd-content'>" + jsonArray[i].title + "<span class='float-right wb-trash'></span></div></li>"); root.find('ol.dd-list:first').append($li); if (typeof jsonArray[i].children !== 'undefined') { nestableJSON(jsonArray[i].children, $li); } } $('#nestable02a').nestable({ group: 1, maxDepth: 3, callback: function(e){ var list = e.length ? e : $(e.target); $('#nestableOutput').text(window.JSON.stringify(list.nestable('serialize'))); console.log('json updated'); } }); } nestableJSON(<?php echo $primary_menu_json; ?>); });