sample.html ファイル内に次のような HTML コードがあります。
<ul id='topics' class='filetree'>
<li><span class='folder'><a href='?Lang=en&TopicID=#'>Topics</a></span>
<ul>
<li><span class='folder'><a href='?Lang=en&TopicID=1'>Topic 1</a></span>
<ul>
<li><span class='file'><a href='?Lang=en&TopicID=1.1'>Topic 1.1</a></span></li>
<li><span class='file'><a href='?Lang=en&TopicID=1.2'>Topic 1.2</a></span></li>
<li><span class='file'><a href='?Lang=en&TopicID=1.3'>Topic 1.3</a></span></li>
</ul>
</li>
JQuery.loadを使用して、Treeview を生成するために html ファイルをロードします
<div id="LtrLeftContent">
<script language="javascript" type="text/javascript">
$('#LtrLeftContent').load('sample.html', function () {
$("#topics").treeview();
$("li span").click(function () {
alert($(this).text()); // Get the current node text
});
});
</script>
</div>
さて、以下に説明する問題
次のノードと同じように任意のノードをクリックした後
<li><span class='folder'><a href='?Lang=en&TopicID=1'>Topic 1</a></span></li>
ポスト バックが発生し、ツリー ビューで選択したノードの状態を維持できません。
以下のコードを試してみましたが、成功しませんでした
プロセス 1:
$("li span").bind('click', function() {
//clear all clicked items if any
$('.selected').removeClass('select');
//set this clicked
$(this).addClass('select');
});
※工程2:※
$("li span").click(function() {
//clear all clicked items if any
$('.selected').removeClass('selected');
//set this clicked
$(this).addClass('selected');
});
質問 1:ポストバック後に選択したノードの状態を維持する方法。その特定のノードを強調表示します。
の用途は何ですか
persist: "cookie",
cookieId: "navigationtree"
状態を維持できないのはなぜですか?
問題が解決しました
$("#topics").treeview({
persist: "location"
});
詳細な説明を含む非常に便利なリンク
URL : jQuery TreeView v1.4 ドキュメント
注: しかし、以下のコードを使用すると正しく動作しない理由がわかりません
persist: "cookie",
cookieId: "navigationtree"