# TreeList widget is not visible

**URL:** https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756
**Category:** Developing Nodes
**Tags:** editor
**Created:** [15 September 2022 15:55 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756 "2022-09-15T15:55:52Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![sangwoo](https://avatars.discourse-cdn.com/v4/letter/s/7cd45c/32.png) [@sangwoo](https://discourse.nodered.org/u/sangwoo)
#### Post date: [15 September 2022 15:55 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756/1 "2022-09-15T15:55:52Z")

</div>

I studied the contents of the link, but the treelist is not visible.  
[TreeList Widget : Node-RED](https://nodered.org/docs/api/ui/treeList/)  
[node-red/60-link.html at master · node-red/node-red · GitHub](https://github.com/node-red/node-red/blob/master/packages/node_modules/@node-red/nodes/core/common/60-link.html#L150)

Below is my code.

```auto
<script type="text/html" data-template-name="api-gui">
    <div class="form-row node-input-link-row"></div>
</script>

...

 oneditprepare: function() {        
            let treeList;
            
            treeList = $("<div>")
            .css({width: "100%", height: "100%"})
            .appendTo(".node-input-link-row")
            .treeList({});
         
            treeList.treeList('data',[{label:"Colours", id:'my-red-item'}]);
            setTimeout(function() {
                treeList.treeList('show', 'my-red-item');
            }, 100);
        }
...

```

I ran it even without setTimeout, but I don't see it.  
Did I write something wrong?

Please, give me a solution.

---

<div class="post-metadata">

### Author: ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)
#### Post date: [15 September 2022 17:09 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756/2 "2022-09-15T17:09:28Z")

</div>

Please don't double post. There was no need to open this 2nd post.

People will answer if they know how to help.

---

<div class="post-metadata">

### Author: ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)
#### Post date: [15 September 2022 20:46 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756/3 "2022-09-15T20:46:09Z")

</div>

Your code looks fine. However, you need to resize the form-row.

> [@sangwoo](#):
>
> ```auto
> <script type="text/html" data-template-name="api-gui">
> <div class="form-row node-input-link-row"></div>
> </script>
> 
> ```

You could add a height style ...

```auto
<div class="form-row node-input-link-row" style="height: calc(100% - 40px);">

```

OR

Do what the link node does (as I linked to in your other thread)

See this: [60-link.html#L156-L165](https://github.com/node-red/node-red/blob/f060309002e41ce0ab610b7d78f58f0ccdb4042d/packages/node_modules/%40node-red/nodes/core/common/60-link.html#L156-L165)  
and this: [60-link.html#L267](https://github.com/node-red/node-red/blob/f060309002e41ce0ab610b7d78f58f0ccdb4042d/packages/node_modules/%40node-red/nodes/core/common/60-link.html#L267)

---

<div class="post-metadata">

### Author: ![sangwoo](https://avatars.discourse-cdn.com/v4/letter/s/7cd45c/32.png) [@sangwoo](https://discourse.nodered.org/u/sangwoo)
#### Post date: [16 September 2022 03:00 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756/4 "2022-09-16T03:00:47Z")

</div>

Thanks for your reply.  
I solved the problem thanks to you!  
And I'll make sure not to double-post.

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)
#### Post date: [30 September 2022 03:00 UTC](https://discourse.nodered.org/t/treelist-widget-is-not-visible/67756/5 "2022-09-30T03:00:54Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.