Блог

В настоящее время у меня есть jsTree, в котором отображаются элементы списка с флажками внутри них.

Моя цель: отправить значение выбранных элементов списка в форму PHP POST.

Вот как я повторяю их на своем сайте:

 echo '<li id="dynamicID"><input name="checkboxname" type="checkbox" id="SameIdThanListItemID" value="checkboxvalue">List item text</li>
 

Это работает нормально, и мои элементы списка отображаются так, как предполагалось.

У нас есть сначала проверка элемента списка, затем значок jsTree, затем ввод флажка, который я должен использовать для отправки сообщения (этот флажок будет скрыт). Флажки не могут быть нажаты, я предполагаю, что это связано с поведением jsTree.

В настоящее время дерево настроено на отключение множественного выбора, поэтому мы не сталкиваемся с проблемами, связанными с массивами. Мы никогда не будем работать с более чем одним идентификатором.

Проблема возникает, когда я пытаюсь установить флажок при нажатии на элементы списка.

     $("#tree").bind("changed.jstree",

        function (e, data) {       

        var nodeId = $('#tree').jstree().get_selected("id")[0].id;

        // Shows up the proper ID selected, and both checkbox and 
        // list item have the same ID, so we're good untill here
        console.log(nodeId); 

        // We've got the ID properly stored into nodeId,and we've checked it with console.Log, 
        // however, the input checkbox its never getting selected.
        document.getElementById(nodeId).checked = true;

        }
    );
 

Я обнаружил, что флажки не смогут быть установлены / сняты, если они находятся внутри <li></li> тегов jsTree.

Чтобы исправить это, я просто сделал цикл вне дерева и повторил каждый флажок в скрытом div. Теперь при выборе элементов списка также устанавливается соответствующий флажок, поэтому отправка сообщения работает так, как задумано.