# Custom Dropdown Node

**URL:** <https://discourse.nodered.org/t/custom-dropdown-node/43800>\
**Category:** Developing Nodes\
**Created:** [7 April 2021 08:17 UTC](https://discourse.nodered.org/t/custom-dropdown-node/43800 "2021-04-07T08:17:35Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![jake123](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jake123](https://discourse.nodered.org/u/jake123)\
**Post date:** [7 April 2021 08:17 UTC](https://discourse.nodered.org/t/custom-dropdown-node/43800/1 "2021-04-07T08:17:35Z")

</div>

I created a custom dropdown node that gets the data from some API and stores it in the dropdown menu.  
If i select some of the option it all works fine.But then when i open the node the second time i dont know what i selected previously. The problem bugs me becouse what if i have like 50 objects given from the API and if i select 30 of them . How would i later on know which one i have selected?

---

<div class="post-metadata">

**Author:** ![jake123](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jake123](https://discourse.nodered.org/u/jake123)\
**Post date:** [7 April 2021 08:49 UTC](https://discourse.nodered.org/t/custom-dropdown-node/43800/2 "2021-04-07T08:49:49Z")

</div>

And now i made a filter in vanilla js. It works fine but when i try to implement it in node-red it doesnt work.

````auto
 function filter() {
        var keyword = $("#node-input-keyword").val();
        var select = $("#node-input-options");
        for (var i = 0; i < select.length; i++) {
          var txt = select.options[i].text;
          if (
            txt.substring(0, keyword.length).toLowerCase() !==
              keyword.toLowerCase() &&
            keyword.trim() !== ""
          ) {
            select.options[i].style.display = "none";
          } else {
            select.options[i].style.display = "list-item";
          }
        }
      }```

this is the code for the filter function. Now i need it to trigger the function on keyup on input.
How do i access that function in script type html.
````

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [7 April 2021 09:28 UTC](https://discourse.nodered.org/t/custom-dropdown-node/43800/3 "2021-04-07T09:28:45Z")

</div>

Without seeing the code you have tried in a node-red node, then we can't really help.

Have you working through the 'creating nodes' guide as was suggested in your previous thread? [Node properties : Node-RED](https://nodered.org/docs/creating-nodes/properties)

In your `oneditprepare` you will know what the node is already configured with using `this.options`. Using that information you'll be able to set the selected state of each option when you reload the list of available options.

---

<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:** [6 June 2021 09:28 UTC](https://discourse.nodered.org/t/custom-dropdown-node/43800/4 "2021-06-06T09:28:46Z")

</div>

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