ProfK
ProfK

Reputation: 51084

jsTree removes text from <li> tags

I am trying jsTree for the first time, and have the problem that after calling jstree(), the text in my <li> elements vanishes. After the call, my tree looks like this:

<div id="assessment-treeview" class="jstree jstree-0 jstree-focused jstree-classic">
    <ul>
        <li class="jstree-last jstree-open"><ins class="jstree-icon">&nbsp;</ins>
            <ul style="">
                <li class="jstree-last jstree-open"><ins class="jstree-icon">&nbsp;</ins>
                    <ul style="">
                        <li class="jstree-last jstree-leaf"><ins class="jstree-icon">&nbsp;</ins></li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

Before the call it looks like this:

<div id="assessment-treeview">
    <ul>
        <li>Specific Outcomes
            <ul>
                <li>[section: name not available for import]
                    <ul>
                        <li>[outcome: name not available for import] </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

The jstree call looks like this:

$("#assessment-treeview").jstree({ "themes": { "theme": "classic" } });

What could be causing this?

Upvotes: 0

Views: 663

Answers (1)

ProfK
ProfK

Reputation: 51084

jsTree doesn't like pure text nodes inside the 'li' tag. When I put the item text into a tag like 'span', everything worked fine again.

From the question code above:

<li><span>Specific Outcomes</span>
    <ul>
    .        
    .       
    </ul>
</li>

Upvotes: 4

Related Questions