# Want to directly go to the page

**URL:** https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203
**Category:** Dashboard
**Tags:** node-red-dashboard
**Created:** [1 August 2023 07:20 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203 "2023-08-01T07:20:55Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [1 August 2023 07:20 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/1 "2023-08-01T07:20:55Z")

</div>

Hi,  
I have 3 or 4 data say (string :1,2,3)which I am injecting via injector ( will switch to _serial out node_ in later where I am gonna fetch datas from ardunio). I have connected to these injectors to individual function node where I am writing a small code to control my uI\_control. That ui\_control is connected to a individual template nodes having video files.

Now here I want to change these pages according to the data coming string 1 for page 1 , string 2 to page 2 and string3 for page 3.

---

<div class="post-metadata">

### Author: ![Sean-McG](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/sean-mcg/32/54677_2.png) [@Sean-McG](https://discourse.nodered.org/u/Sean-McG)
#### Post date: [1 August 2023 15:38 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/2 "2023-08-01T15:38:18Z")

</div>

Can you post a small flow that shows the problem you have ?

---

<div class="post-metadata">

### Author: ![novski](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/novski/32/23243_2.png) [@novski](https://discourse.nodered.org/u/novski)
#### Post date: [1 August 2023 16:45 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/3 "2023-08-01T16:45:24Z")

</div>

Do you mean change tabs on the UI (dashboard) like this: [How can i change tabs with button? - #12 by dceejay](https://discourse.nodered.org/t/how-can-i-change-tabs-with-button/27010/12)

---

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [2 August 2023 03:43 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/4 "2023-08-02T03:43:36Z")

</div>

No.. I am not gonna use any buttons.

---

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [2 August 2023 04:00 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/5 "2023-08-02T04:00:26Z")

</div>

this is my code. where I am triggering my videos using a injectors which sends a strings at random duration's.

```auto
[
    {
        "id": "bac113592b6fd1c6",
        "type": "tab",
        "label": "Flow 5",
        "disabled": false,
        "info": "",
        "env": []
    },
    {
        "id": "a38b96e93c8edce0",
        "type": "ui_template",
        "z": "bac113592b6fd1c6",
        "group": "ba7c38a2.8c8a1",
        "name": "P2",
        "order": 1,
        "width": 25,
        "height": "16",
        "format": "<div>\n <video id=\"Video_1\"\n class=\"video-js vjs-default-skin vjs-big-play-centered\" width=\"1280\" height=\"800\">\n <source src=\"http://127.0.0.1:8080/V1.mp4\" type=\"video/mp4\">\n Your browser does not support the video tag.\n <br>\n <button onclick=\"playVideo()\">Play</button>\n </video>\n</div>\n\n<script>\n // Add jQuery code here\n $(function() {\n // Replace \"URL_OF_YOUR_VIDEO_FILE\" with the actual URL of your video file.\n var videoSrc = \"http://127.0.0.1:8080/V1.mp4\";\n \n // Get the video element by its ID\n var videoElement = document.getElementById(\"Video_1\");\n var video = document.getElementById(\"videoSrc\");\n \n // Set the source of the video element\n $(videoElement).attr(\"src\", videoSrc);\n //video.play();\n // Load the video and play it\n videoElement.load();\n videoElement.play();\n });\n</script>",
        "storeOutMessages": true,
        "fwdInMessages": true,
        "resendOnRefresh": true,
        "templateScope": "local",
        "className": "",
        "x": 1050,
        "y": 140,
        "wires": [
            []
        ]
    },
    {
        "id": "c6d9d9c057fb025d",
        "type": "ui_template",
        "z": "bac113592b6fd1c6",
        "group": "4998d1462a53dd13",
        "name": "P1",
        "order": 1,
        "width": "26",
        "height": "16",
        "format": "<div>\n <link href=\"https://unpkg.com/video.js@7/dist/video-js.min.css\" rel=\"stylesheet\">\n <h1> VIDEO 1 PAGE 1</h1>\n <video id=\"Video_2\"\n class=\"video-js vjs-default-skin vjs-big-play-centered\" width=\"1280\" height=\"800\"poster=\"google.jpg\">\n <source src=\"http://127.0.0.1:8080/V2.mp4\" type=\"video/mp4\">\n Your browser does not support the video tag.\n <br>\n <button onclick=\"playVideo()\">Play</button>\n </video>\n</div>\n<script>\n // Add jQuery code here\n $(function() {\n // Replace \"URL_OF_YOUR_VIDEO_FILE\" with the actual URL of your video file.\n var videoSrc = \"http://127.0.0.1:8080/V2.mp4\";\n \n // Get the video element by its ID\n var videoElement = document.getElementById(\"Video_2\");\n var video = document.getElementById(\"videoSrc\");\n \n // Set the source of the video element\n $(videoElement).attr(\"src\", videoSrc);\n //video.play();\n // Load the video and play it\n videoElement.load();\n videoElement.play();\n });\n</script>\n\n",
        "storeOutMessages": true,
        "fwdInMessages": true,
        "resendOnRefresh": true,
        "templateScope": "local",
        "className": "",
        "x": 1010,
        "y": 100,
        "wires": [
            []
        ]
    },
    {
        "id": "96e14a9325eb3d07",
        "type": "switch",
        "z": "bac113592b6fd1c6",
        "name": "",
        "property": "payload",
        "propertyType": "msg",
        "rules": [
            {
                "t": "cont",
                "v": "1",
                "vt": "str"
            },
            {
                "t": "cont",
                "v": "2",
                "vt": "str"
            },
            {
                "t": "cont",
                "v": "3",
                "vt": "str"
            }
        ],
        "checkall": "true",
        "repair": false,
        "outputs": 3,
        "x": 410,
        "y": 180,
        "wires": [
            [
                "08a7d77d0f509529"
            ],
            [
                "1307c1697b664543",
                "3352791f8616ee46"
            ],
            [
                "097459dbfa3e0173"
            ]
        ]
    },
    {
        "id": "2b2e290979258af9",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "d": true,
        "name": "F2",
        "func": "if ( msg.payload == 2){\nmsg.ui_control = {\n \"tab\": \"TAB 2\", // Replace with the name of your Dashboard tab\n \"payload\": msg.payload // The payload should contain the tab index (e.g., 0, 1, 2, etc.)\n}};\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 650,
        "y": 460,
        "wires": [
            []
        ]
    },
    {
        "id": "edf62c08ab268bd8",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "d": true,
        "name": "F1",
        "func": "if (msg.payload==1){\n msg.ui_control = {\n \n \"tab\": \"TAB 1\", // Replace with the name of your Dashboard tab\n \"payload\": msg.payload // The payload should contain the tab index (e.g., 0, 1, 2, etc.)\n}};\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 910,
        "y": 460,
        "wires": [
            []
        ]
    },
    {
        "id": "3b5dc99bc44687e6",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "d": true,
        "name": "f3",
        "func": "if (msg.payload == 3) {\n msg.ui_control = {\n \"tab\": \"TAB 3\", // Replace with the name of your Dashboard tab\n \"payload\": msg.payload // The payload should contain the tab index (e.g., 0, 1, 2, etc.)\n }\n};\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 790,
        "y": 480,
        "wires": [
            []
        ]
    },
    {
        "id": "1a7049cd3476e63e",
        "type": "ui_template",
        "z": "bac113592b6fd1c6",
        "group": "e6607a6af2d3b328",
        "name": "P3",
        "order": 1,
        "width": 0,
        "height": 0,
        "format": "<div>\n <video id=\"Video_3\" class=\"video-js vjs-default-skin vjs-big-play-centered\" width=\"1280\" height=\"800\">\n <source src=\"http://127.0.0.1:8080/v3.mp4\" type=\"video/mp4\">\n Your browser does not support the video tag.\n <br>\n <button onclick=\"playVideo()\">Play</button>\n </video>\n</div>\n\n<script>\n // Add jQuery code here\n $(function() {\n // Replace \"URL_OF_YOUR_VIDEO_FILE\" with the actual URL of your video file.\n var videoSrc = \"http://127.0.0.1:8080/v3.mp4\";\n \n // Get the video element by its ID\n var videoElement = document.getElementById(\"Video_3\");\n var video = document.getElementById(\"videoSrc\");\n \n // Set the source of the video element\n $(videoElement).attr(\"src\", videoSrc);\n //video.play();\n // Load the video and play it\n videoElement.load();\n videoElement.play();\n });\n</script>",
        "storeOutMessages": true,
        "fwdInMessages": true,
        "resendOnRefresh": true,
        "templateScope": "local",
        "className": "",
        "x": 1030,
        "y": 180,
        "wires": [
            []
        ]
    },
    {
        "id": "27a1e8bedc0c9f34",
        "type": "inject",
        "z": "bac113592b6fd1c6",
        "name": "",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "900",
        "crontab": "",
        "once": false,
        "onceDelay": "2",
        "topic": "",
        "payload": "2",
        "payloadType": "str",
        "x": 190,
        "y": 120,
        "wires": [
            [
                "96e14a9325eb3d07"
            ]
        ]
    },
    {
        "id": "346341e151bfa621",
        "type": "comment",
        "z": "bac113592b6fd1c6",
        "name": "",
        "info": "",
        "x": 140,
        "y": 380,
        "wires": []
    },
    {
        "id": "9c6d7e6b7871434a",
        "type": "inject",
        "z": "bac113592b6fd1c6",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "3600",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "1",
        "payloadType": "str",
        "x": 170,
        "y": 200,
        "wires": [
            [
                "96e14a9325eb3d07"
            ]
        ]
    },
    {
        "id": "08a7d77d0f509529",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "name": "FT1",
        "func": "msg.payload = {\n \"command\": \"change\",\n \"payload\": {\n \"tab\": \"TAB 1\" // Replace with the desired page/tab name\n }\n}\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 630,
        "y": 60,
        "wires": [
            [
                "503703dcea578fb6"
            ]
        ]
    },
    {
        "id": "503703dcea578fb6",
        "type": "ui_ui_control",
        "z": "bac113592b6fd1c6",
        "name": "",
        "events": "all",
        "x": 820,
        "y": 160,
        "wires": [
            [
                "c6d9d9c057fb025d",
                "a38b96e93c8edce0",
                "1a7049cd3476e63e"
            ]
        ]
    },
    {
        "id": "1307c1697b664543",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "name": "FT 2",
        "func": "msg.payload = {\n \"command\": \"change\",\n \"payload\": {\n \"tab\": \"TAB 2\" // Replace with the desired page/tab name\n }\n}\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 610,
        "y": 160,
        "wires": [
            [
                "503703dcea578fb6"
            ]
        ]
    },
    {
        "id": "097459dbfa3e0173",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "name": "FT 3",
        "func": "msg.payload = {\n \"command\": \"change\",\n \"payload\": {\n \"tab\": \"TAB 1\" // Replace with the desired page/tab name\n }\n}\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 630,
        "y": 220,
        "wires": [
            [
                "503703dcea578fb6"
            ]
        ]
    },
    {
        "id": "26805daa187ddc4a",
        "type": "function",
        "z": "bac113592b6fd1c6",
        "name": "function 1",
        "func": "\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 860,
        "y": 300,
        "wires": [
            []
        ]
    },
    {
        "id": "3352791f8616ee46",
        "type": "debug",
        "z": "bac113592b6fd1c6",
        "name": "debug 1",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "false",
        "statusVal": "",
        "statusType": "auto",
        "x": 600,
        "y": 280,
        "wires": []
    },
    {
        "id": "75bc48931906eece",
        "type": "inject",
        "z": "bac113592b6fd1c6",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "3",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "3",
        "payloadType": "str",
        "x": 150,
        "y": 280,
        "wires": [
            [
                "96e14a9325eb3d07"
            ]
        ]
    },
    {
        "id": "ba7c38a2.8c8a1",
        "type": "ui_group",
        "name": "VIDEO 2",
        "tab": "9d40a5bbecffef6e",
        "order": 1,
        "disp": true,
        "width": "25",
        "collapse": false,
        "className": ""
    },
    {
        "id": "4998d1462a53dd13",
        "type": "ui_group",
        "name": "VIDEO 1",
        "tab": "1b1b784f962c16f2",
        "order": 1,
        "disp": true,
        "width": "28",
        "collapse": false,
        "className": ""
    },
    {
        "id": "e6607a6af2d3b328",
        "type": "ui_group",
        "name": "VIDEO 3",
        "tab": "d2a1fc7ec0d29bab",
        "order": 1,
        "disp": true,
        "width": 28,
        "collapse": false,
        "className": ""
    },
    {
        "id": "9d40a5bbecffef6e",
        "type": "ui_tab",
        "name": "TAB 2",
        "icon": "dashboard",
        "order": 2,
        "disabled": false,
        "hidden": false
    },
    {
        "id": "1b1b784f962c16f2",
        "type": "ui_tab",
        "name": "TAB 1",
        "icon": "dashboard",
        "order": 1,
        "disabled": false,
        "hidden": false
    },
    {
        "id": "d2a1fc7ec0d29bab",
        "type": "ui_tab",
        "name": "Tab 3",
        "icon": "dashboard",
        "order": 3
    }
]

```

---

<div class="post-metadata">

### Author: ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)
#### Post date: [2 August 2023 07:07 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/6 "2023-08-02T07:07:24Z")

</div>

Why change page, just change the video.  
I do not feel the duplication is required. If it is you should get enough clues from example to change tabs.  
e.g.

```auto
[{"id":"27a1e8bedc0c9f34","type":"inject","z":"bac113592b6fd1c6","name":"","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":"2","topic":"","payload":"2","payloadType":"str","x":210,"y":140,"wires":[["08a7d77d0f509529"]]},{"id":"08a7d77d0f509529","type":"function","z":"bac113592b6fd1c6","name":"FT1","func":"let msg1 = {video: msg.payload};\n\nmsg.payload = {\n \"tab\": \"TAB 1\" \n}\nreturn [msg,msg1];","outputs":2,"noerr":0,"initialize":"","finalize":"","libs":[],"x":370,"y":180,"wires":[["503703dcea578fb6"],["c6d9d9c057fb025d"]]},{"id":"9c6d7e6b7871434a","type":"inject","z":"bac113592b6fd1c6","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"1","payloadType":"str","x":170,"y":200,"wires":[["08a7d77d0f509529"]]},{"id":"75bc48931906eece","type":"inject","z":"bac113592b6fd1c6","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"3","payloadType":"str","x":150,"y":280,"wires":[["08a7d77d0f509529"]]},{"id":"503703dcea578fb6","type":"ui_ui_control","z":"bac113592b6fd1c6","name":"","events":"all","x":540,"y":80,"wires":[[]]},{"id":"c6d9d9c057fb025d","type":"ui_template","z":"bac113592b6fd1c6","group":"4998d1462a53dd13","name":"P1","order":1,"width":"26","height":"16","format":"<div>\n <link href=\"https://unpkg.com/video.js@7/dist/video-js.min.css\" rel=\"stylesheet\">\n <h1> VIDEO {{msg.video}}</h1>\n <video id=\"Video_ID\"\n class=\"video-js vjs-default-skin vjs-big-play-centered\" width=\"1280\" height=\"800\"poster=\"google.jpg\">\n <source src=\"http://127.0.0.1:8080/V{{msg.video}}.mp4\" type=\"video/mp4\">\n Your browser does not support the video tag.\n <br>\n <button onclick=\"playVideo()\">Play</button>\n </video>\n</div>\n<script>\n // Add jQuery code here\n $(function() {\n // Replace \"URL_OF_YOUR_VIDEO_FILE\" with the actual URL of your video file.\n var videoSrc = \"http://127.0.0.1:8080/V{{msg.video}}.mp4\";\n \n // Get the video element by its ID\n var videoElement = document.getElementById(\"Video_ID\");\n var video = document.getElementById(\"videoSrc\");\n \n // Set the source of the video element\n $(videoElement).attr(\"src\", videoSrc);\n //video.play();\n // Load the video and play it\n videoElement.load();\n videoElement.play();\n });\n</script>\n\n","storeOutMessages":false,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","className":"","x":610,"y":160,"wires":[[]]},{"id":"4998d1462a53dd13","type":"ui_group","name":"VIDEO 1","tab":"1b1b784f962c16f2","order":1,"disp":false,"width":"28","collapse":false,"className":""},{"id":"1b1b784f962c16f2","type":"ui_tab","name":"TAB 1","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

Untested as i do not have videos.

---

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [7 August 2023 07:29 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/7 "2023-08-07T07:29:14Z")

</div>

stream of data strings will trigger different Videos's. So, I thought I could dump different videos in different pages. I have 6 videos to play, right now i have configured only 2 as a test case.

---

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [12 August 2023 06:34 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/8 "2023-08-12T06:34:23Z")

</div>

Its actually not working... I think something is missing ... I still thinking on this

---

<div class="post-metadata">

### Author: ![Vaibhavi27](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vaibhavi27/32/70897_2.png) [@Vaibhavi27](https://discourse.nodered.org/u/Vaibhavi27)
#### Post date: [23 August 2023 08:52 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/9 "2023-08-23T08:52:36Z")

</div>

function node does not triggering my ui\_control.

---

<div class="post-metadata">

### Author: ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)
#### Post date: [23 August 2023 13:53 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/10 "2023-08-23T13:53:32Z")

</div>

Not enough information, what is going into function, what is coming out of both function outputs. Also an example flow.

---

<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: [22 September 2023 13:54 UTC](https://discourse.nodered.org/t/want-to-directly-go-to-the-page/80203/11 "2023-09-22T13:54:02Z")

</div>

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