1

チェックボックスツリーフォームが欲しかったので、dynatree jquery tree を使用してそれを行いました。次に、dynatree が実際のチェックボックスを使用しないことがわかったので、ツリー内に html チェックボックスを配置しました。

ノードが展開/折りたたまれたときにチェックされた（目盛り）値が削除されることに気付くまで、正常に動作します JavaScriptでこれを防ぐ関数を書く方法はありますか？

本当にありがとう。これが私のコードです

 $(function(){
      $("#tree").dynatree({
        // using default options

        checkbox: false,
        selectMode: 3,
        noLink: true,


    });

 <div id="tree">
    <ul>
      <li id="key1" title="Look, a tool tip!">
        <input type="checkbox" id="chb-key1" name="selected_items" value="Item 1" class="" />Item 1</li>
      <li id="key2">
        <input type="checkbox" id="chb-key2" name="selected_items" value="Item 2" />Item 2</li>
      <li id="key3">
        <input type="checkbox" id="chb-key3" name="selected_items" value="Item 3" />Folder with some children
        <ul>
          <li id="key31">
            <input type="checkbox" id="chb-key31" name="selected_items" value="Item 3.1" />Sub-item 3.1</li>
          <li id="key32" class="selected">
            <input type="checkbox" id="chb-key32" name="selected_items" value="Item 3.2" />Sub-item 3.2
            <ul>
              <li id="key321" class="selected">
                <input type="checkbox" id="chb-key321" name="selected_items" value="Item 3.2.1" />Sub-item 3.2.1</li>
              <li id="key322" class="selected">
                <input type="checkbox" id="chb-key322" name="selected_items" value="Item 3.2.2" />Sub-item 3.2.2</li>
            </ul>
          </li>
        </ul>
      </li>
4

1 に答える 1

0

私は同じ問題に遭遇しました。私がそれを解決した方法は、「チェックボックス：真」を入れて、実際のチェックボックスを非表示にし、偽のボックスがチェック/チェック解除されるたびにそれらをチェック/チェック解除することでした.

これが私のコードです：

    $("#storyCategories").dynatree({
    //Tree parameters
    persist: false,
    checkbox: true,
    selectMode: 3,
    activeVisible: true,

    //Un/check real checkboxes recursively after selection
    onSelect: function (select, dtnode) {
        if (select) {
            $("#chb-" + dtnode.data.key).attr("checked", "checked").addClass("hidden");
        } else {
            $("#chb-" + dtnode.data.key).removeAttr("checked").addClass("hidden");
        }
        //  $("#chb-" + dtnode.data.key).attr("checked", select).addClass("hidden");
        dtnode.visit(function (dtnode) {
            if (select) {
                $("#chb-" + dtnode.data.key).attr("checked", "checked").addClass("hidden");
            } else {
                $("#chb-" + dtnode.data.key).removeAttr("checked").addClass("hidden");
            }
        }, null, true);
    },
    //Hack to prevent appearing of checkbox when node is expanded/collapsed
    onExpand: function (select, dtnode) {
        $("#storyCategories :checkbox").addClass("hidden");
        //$("#chb-" + dtnode.data.key).attr("checked", dtnode.isSelected()).addClass("hidden");
        if (dtnode.isSelected()) {
            $("#chb-" + dtnode.data.key).attr("checked", "checked").addClass("hidden");
        } else {
            $("#chb-" + dtnode.data.key).removeAttr("checked").addClass("hidden");
        }
    }
});
    //Hide real checkboxes
    $("#storyCategories :checkbox").addClass("hidden");

この記事のコードを使用しましたが、更新する必要がありました: http://www.llakomy.com/articles/adding-dynatree-with-checkboxes-to-a-form。

于 2013-01-31T10:39:04.463 に答える