# Does Node-Red have the ability to make a requester?

**URL:** <https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711>\
**Category:** Dashboard\
**Created:** [26 July 2019 09:31 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711 "2019-07-26T09:31:11Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 09:31 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/1 "2019-07-26T09:31:11Z")

</div>

Although there is the `text input` node.

I'm just wondering if there is a way to make a requester pop up?

I know that would be after a button is pressed so really I could change things around and put a `text input` node there....

But screen real estate/layout.

A requester would be nice.

Just asking.

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [26 July 2019 10:08 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/2 "2019-07-26T10:08:24Z")

</div>

When you say requester, do you mean a (fancy) popup overlaying the page where you can fill in a form, such as a modal? Or something else entirely

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 10:22 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/3 "2019-07-26T10:22:09Z")

</div>

The former.

A "fancy" popup overlaying the page.

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [26 July 2019 11:29 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/4 "2019-07-26T11:29:49Z")

</div>

Try the suggestions in this topic 🙂

> [@How to show modal dialog in template node](https://discourse.nodered.org/t/how-to-show-modal-dialog-in-template-node/611):
>
> Hi guys, I would like to show modal dialog via template node. I have couple of inputs and want to show modal dialog, when user submit values, to confirm what will happen. Thank you for a help. Content of my template node: \<md-input-container\> \<label\>SSID\</label\> \<input name="retention\_duration" ng-model="msg.payload.wifi.ssid" required \> \<md-tooltip md-direction="top"\>SSID can be anything\</md-tooltip\> \</md-input-container\> \<md-input-container\> \<label\>Password\</label\> \<inpu…

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 11:32 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/5 "2019-07-26T11:32:34Z")

</div>

Following the link, _reply #8_......

Ok. I am going to have to work out how to use that.

Does it import to NR?

(Runs off trying that)

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [26 July 2019 11:34 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/6 "2019-07-26T11:34:00Z")

</div>

It’s using the Dashboard template node.

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 11:37 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/7 "2019-07-26T11:37:35Z")

</div>

(I'm going to cop it for asking, but....)

Ok, put it in the dashboard `template` node.

Stuck an `inject` node into it.

Injected and.....

(am I supposed to send anything to set up the request?)

I'm guessing I may. But this is really getting at/beyond my knowledge.  
(I'm trying)

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 11:48 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/8 "2019-07-26T11:48:39Z")

</div>

So looking at the code:

```auto
<script>
    // Get the modal
var modal = document.getElementById('myModal');

// Get the button that opens the modal
var btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

```

Those variables need to be _set_ to something as they are used to make the requester?

But (showing ignorance) what is `document.get....`?

---

<div class="post-metadata">

**Author:** ![afelix](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/afelix/32/9743_2.png) [@afelix](https://discourse.nodered.org/u/afelix)\
**Post date:** [26 July 2019 12:22 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/9 "2019-07-26T12:22:09Z")

</div>

Ooh boy, I forgot about that for a moment. I’m going to link you some manuals. These were mentioned last month in other topics, but as far as I know there are no existing ui nodes to do this. Meaning if you want the functionality you will have to program it yourself. Which means HTML and JavaScript.

This however is not beginner level. I’d say it’s intermediate but to understand what you’re doing you will need a bit of experience with basics. So I’m going to link a few different things, and it’s up to you if you’re willing to go that way.

Here’s a CodeAcademy starter course for JavaScript. I’d say that, as long as you’re not planning to write custom nodes, blocks 1-8 and 12-14 should give you most regular things to use in function and template nodes. You won’t have to worry about the transpiling down from block 10, the things covered in this course are all supported in Node-RED without additional steps.

> **[JavaScript Tutorial: Learn JavaScript For Free | Codecademy](https://www.codecademy.com/learn/introduction-to-javascript)**
>
> Learn JavaScript and Javascript arrays to build interactive websites and pages that adapt to every device. Add dynamic behavior, store information, and handle requests and responses.

For the code from reply 8, understanding of the HTML block model/DOM is needed. Remember the stacking wooden figurines comparison I made in the other thread? Exactly like that. The `document.getElementById` call searches for an element from the html added to the template with the `id` attribute set to that value.  
W3Schools has a decent tutorial to get started with HTML. To understand what is going on here/things that might be useful for understanding other Node-RED topics too.

[https://www.w3schools.com/html/default.asp](https://www.w3schools.com/html/default.asp)

If you follow that until they start talking about `<canvas>` it will cover most you’ll might encounter.

Next, to combine your new JavaScript with HTML knowledge, take a look at Mozilla’s introduction to DOM programming:

> **[Introduction to the DOM](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction)**
>
> The Document Object Model (DOM) is the data representation of the objects that comprise the structure and content of a document on the web. In this guide, we'll briefly introduce the DOM.

> **[Document Object Model (DOM)](https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model)**
>
> The Document Object Model (DOM) connects web pages to scripts or programming languages by representing the structure of a document—such as the HTML representing a web page—in memory.

> **[The HTML DOM API](https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM)**
>
> The HTML DOM API is made up of the interfaces that define the functionality of each of the elements in HTML, as well as any supporting types and interfaces they rely upon.

Good luck!

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [26 July 2019 13:00 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/10 "2019-07-26T13:00:25Z")

</div>

You don't need to inject template nodes. Just add a template node, copy & paste the code from the modal example, ok, deploy, refresh dashboard and you will get a button. Click it and you should get a modal window.

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 21:29 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/11 "2019-07-26T21:29:25Z")

</div>

Bakman2,

Yeah, I sort of get that, but I guess I just wanted to be sure the node was "invoked".

So...... That aside (my stuff). You say, stick the node in a flow and deploy.  
I will get a button.... Where?  
Click on _it_ (the button I'm guessing) and I should get a _modal window_.

As there is no sign of said button, I am kinda lost.  
(But that is status-quo for me.)

(Edit)

Ok, silly me.  
Look in the node's option.  
Found it.  
Shall continue exploring.

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [26 July 2019 21:29 UTC](https://discourse.nodered.org/t/does-node-red-have-the-ability-to-make-a-requester/13711/12 "2019-07-26T21:29:58Z")

</div>

Alfelix,

Thanks. Shall look at soon.