0

私はこのプラグインを使用しています：http： //mjsarfatti.com/sandbox/nestedSortable/

これは素晴らしいようで、デフォルトのjQueryUIソート可能ファイルにいくつかのオプションを追加するだけです（https://github.com/mjsarfatti/nestedSortable-1.9以降では機能しません）。

ただし、このフィドルからわかるように、問題があるようです。http: //jsfiddle.net/kzswp/6/により、ネストされたすべてのリストアイテムが、ルートの最も小さいアイテムの下にある1つの大きなアイテムとしてカウントされているようです。

また、ルートアイテムの1つをドラッグして、他のルートアイテムの子にする場合、順序文字は一貫していません。既存のネストされたリストに子アイテムとしてアイテムを設定しようとしても、そのアイテムを配置するための新しいリストが作成されているようです。

これが私のマークアップです：

<ol type="I" id="top-level-list">
        <li>
            <h3>Category #1</h3>
            <div class="child-items">
                    <ol type="A">
                        <li>
                             <div class="form-row" >
                                <div class="form-item">Question #1</div>
                            </div>
                    <div class="child-items">
                        <ol type="1">
                            <li>
                                <div class="required-parent-response c7ad1cdb-e727-4fb7-b0eb-0f04382dcd86">
                                    <div class="form-row" >
                                        <div class="form-item">Some other question</div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="required-parent-response c7ad1cdb-e727-4fb7-b0eb-0f04382dcd86">
                                    <div class="form-row" >
                                        <div class="form-item">Branch Question - under Question #1</div>
                                    </div>
                                </div>
                            </li>
                        </ol>
                    </div>
            </li>
                    </ol>

                    </div>
        </li>
        <li>
            <h3>Category #2</h3>
            <div class="child-items">
                <ol type="A">
                    <li>
                        <div class="form-row" >
                            <div class="form-item">Category #2 - question 1</div>
                        </div>

                    </li>
                </ol>
            </div>
        </li>

</ p>

<div class="child-items">問題はネストされたリストの周囲にあると思いました（ページ上の他のJSにこれが必要です）が、削除した後でも：http: //jsfiddle.net/xJzZU/1/

これは順序文字を修正するだけですが、すべてのサブリストとそのアイテムは1つの大きなアイテムとしてカウントされます。

child-itemsこれらのネストされた要素を囲むdivを維持しながら、これを修正する方法を知っている人はいますか？

4

1 に答える 1

2

まず、オプションにitemsandを追加する必要toleranceElementがあります。このようなもの：

            $("#top-level-list").nestedSortable({
                //handle: ".ui-icon",
                maxLevels: 3,
                placeholder: "placeholder",
                help: "clone",
                revert: 300,
                opacity: .6,
                forcePlaceholderSize: true,
                tabSize: 40,
                items: 'li',
                toleranceElement: '> *'
            });

第二に、残念ながら、そのエクストラは実際にはnestedSortableでは<div class="child-items">機能しません:/ これは、プラグインが と が直接の親子関係にあることを期待しているためです...ドキュメントに記載されているように、各リスト項目には1つまたは2つのいずれかが必要ですそのうちの 1 つは toleranceElement であり、もう 1 つはネストされたリストです。
olli

于 2012-12-16T16:05:04.597 に答える