jQWidgets Forums

Tagged: children, getItem, jqxtree, Tree

This topic contains 3 replies, has 2 voices, and was last updated by Dimitar 12 years ago.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

jqxTree getItem Posts

May 13, 2013 at 6:27 pm jqxTree getItem #21067

Participant

Hi,
Suppose i use such a following tree

<li>NodeA
	<ul>
		<li>NodeA1</li>
		<li>NodeA1</li>
		<li>NodeA2</li>
		<li>NodeA3</li>
		<li>NodeA4</li>
</ul>
</li>

I wanna know how to get the children of NodeA? Especially how to use the getItem function in this case?

Regards,

Mhanna

May 14, 2013 at 5:23 am jqxTree getItem #21101

Dimitar

Participant

Hello Mhanna,

Here is an example, that shows how to achieve this:

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="../../scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxpanel.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtree.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxexpander.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var theme = getDemoTheme();
            $('#jqxTree').jqxTree({ width: 150, height: 200, theme: theme });
            var allItems = $('#jqxTree').jqxTree('getItems');
            var parentId = allItems[0].id;
            var childrenArray = new Array();
            $.each(allItems, function () {
                if (this.parentId == parentId) {
                    childrenArray.push(this);
                };
            });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxTree'>
        <ul>
            <li>NodeA
                <ul>
                    <li>NodeA1</li>
                    <li>NodeA1</li>
                    <li>NodeA2</li>
                    <li>NodeA3</li>
                    <li>NodeA4</li>
                </ul>
            </li>
        </ul>
    </div>
</body>
</html>

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

May 14, 2013 at 6:08 am jqxTree getItem #21106

Mhanna AbuTareef

Participant

Thanks.

In case of more complicated tree that have more parents – NodeB, NodeC, which in turn have children NodeB1, NodeB2/NodeC1, NodeC2 respectively… How could you extract, For instance, a children of Node B?

May 14, 2013 at 7:21 am jqxTree getItem #21114

Dimitar

Participant

Hi Mhanna AbuTareef,

The key is the parentId variable, which defines the children of which element you are looking for. If do not know exactly where NodeB stands in the items array, you may isolate the top-level items by looking for items with no parentId.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.