Создание значений для формы публикации HTML из списка флажков JStree - PullRequest
Новая
       30

Создание значений для формы публикации HTML из списка флажков JStree

0 голосов
/ 06 сентября 2010

Я только начинаю с JQuery и Javascript и адаптирую вложенный набор входов флажков для использования поведения флажков jstree. Понимая, что каждый элемент должен быть тегом привязки, чтобы быть распознанным кодом jstree, я теперь не уверен, как генерировать значения из элементов для отправки формы POST. Ранее они были входами для флажков, и я хотел бы иметь возможность сохранить их таким образом, чтобы форма все еще функционировала, если бы Javascript был выключен. упаковка входных данных в тег привязки привела к появлению двух флажков для каждого элемента, один из которых стилизован и управляется поведением JStree, а другой игнорируется. Я полагаю, что это не то направление.

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

Я загружаю JStree со следующим кодом конфигурации - 

$(document).ready(function()
{
    $('.nested-category').jstree({ 
        ui: { theme_name : "checkbox" },
        plugins : ["checkbox", "themes", "html_data", "ui" ]
    });
}
);

Вот упрощенная версия формы, которая действует в коде JStree, но не может передавать значения. 

<form method="post" action="">

<div class="nested-category">

<ul class="">
    <li><a href="#">group1</a>
        <ul>
            <li><a href="#">subgroup1</a>
                <ul>
                    <li><a href="#">item1</a></li>
                    <li><a href="#">item2</a></li>
                    <li><a href="#">item3</a></li>
                </ul>
            </li>
            <li><a href="#">subgroup2</a>
                <ul>
                    <li><a href="#">item4</a></li>
                    <li><a href="#">item5</a></li>
                    <li><a href="#">item6</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="#">group2</a>
        <ul>
            <li><a href="#">subgroup3</a>
                <ul>
                    <li><a href="#">item7</a></li>
                    <li><a href="#">item8</a></li>
                    <li><a href="#">item9</a></li>
                </ul>
            </li>
            <li><a href="#">subgroup4</a>
                <ul>
                    <li><a href="#">item10</a></li>
                    <li><a href="#">item11</a></li>
                    <li><a href="#">item12</a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>
</div>

<input class="form-submit" type="submit" name="submit" value="submit">
</form>

Ответы [ 2 ]

1 голос
/ 05 ноября 2010

Я решил проблему, добавив элементы ввода внутри каждого тега привязки, которые скрыты небольшим количеством дополнительного Javascript. Несколько дополнительных строк в скрипте jsTree добавляют 'флажок' к входам, когда проверяется вход, генерируемый jsTree, и наоборот, если вход возвращается в проверенную форму. Если Javascript отключен, флажки ввода работают в обычном режиме в форме HTML. Я могу публиковать примеры и изменения, внесенные в jsTree, если кому-либо понадобится дальнейшее объяснение.

Я не сомневаюсь, что это какой-то неуклюжий способ решения проблемы, но именно в этом я сейчас и не разбираюсь в состоянии веб-разработки!

0 голосов
/ 06 сентября 2010

лично, я бы использовал AJAX.$.post

присваивают якорям идентификатор, и в jsTree я уверен, что есть метод, который получает все выбранные идентификаторы

...