# Dashboard seems to filter html

**URL:** <https://discourse.nodered.org/t/dashboard-seems-to-filter-html/16816>\
**Category:** General\
**Created:** [17 October 2019 13:15 UTC](https://discourse.nodered.org/t/dashboard-seems-to-filter-html/16816 "2019-10-17T13:15:39Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![drivin](https://avatars.discourse-cdn.com/v4/letter/d/8e7dd6/32.png) [@drivin](https://discourse.nodered.org/u/drivin)\
**Post date:** [17 October 2019 13:15 UTC](https://discourse.nodered.org/t/dashboard-seems-to-filter-html/16816/1 "2019-10-17T13:15:39Z")

</div>

Hello.  
I could use your help. I use ui\_template to generate HTML. According to the attached debug-node the code is correct. However, the dashboard seems to filter tags like "name". Can this be turned off somehow or can certain tags be whitelisted?

Here is the problematic flow:

```auto
[
    {
        "id": "e22fec0b.9cd1c8",
        "type": "ui_template",
        "z": "90243100.c40928",
        "group": "dd366daf.ed20e8",
        "name": "",
        "order": 1,
        "width": 7,
        "height": 15,
        "format": "<div ng-bind-html=\"msg.payload\"></div>\n\n<script>\nfunction hist_gal(imgs) {\n var expandImg = document.getElementById(\"expandedImg\");\n var imgText = document.getElementById(\"imgtext\");\n expandImg.src = imgs.src;\n imgText.innerHTML = imgs.alt;\n expandImg.parentElement.style.display = \"block\";\n}\n</script>",
        "storeOutMessages": true,
        "fwdInMessages": false,
        "templateScope": "local",
        "x": 1140,
        "y": 480,
        "wires": [
            []
        ]
    },
    {
        "id": "321e9cb7.9abef4",
        "type": "function",
        "z": "90243100.c40928",
        "name": "convert payload to html",
        "func": "var images = msg.payload\nmsg.payload = \"<div class=\\\"gallery\\\" height=\\\"100%\\\"> \";\n\nmsg.payload += \"<div class=\\\"full-picture\\\">\";\n\nimages.forEach(function(image){\n image = image.replace(\"/home/pi/.node-red/storage\",\"..\");\n var desc = image;\n desc = desc.replace(\"../cam/\",\"\");\n desc = desc.replace(\".jpg\",\"\");\n msg.desc = desc;\n msg.payload += \"<div><a src=\\\"\\\" name=\\\"\" + desc + \"\\\"></a><img src=\\\"\" + image + \"\\\" /></div>\";\n}); \nmsg.payload += \"</div>\";\nmsg.payload += \"</div>\";\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "x": 870,
        "y": 480,
        "wires": [
            [
                "e22fec0b.9cd1c8",
                "c51012b0.205c98"
            ]
        ]
    },
    {
        "id": "390315ac.56fdf2",
        "type": "fs-file-lister",
        "z": "90243100.c40928",
        "name": "",
        "start": "/home/pi/.node-red/storage/cam",
        "pattern": "*.jpg",
        "hidden": false,
        "path": true,
        "single": true,
        "depth": 0,
        "stat": false,
        "x": 440,
        "y": 280,
        "wires": [
            [
                "a3c78564.e348a8",
                "d801f5d5.7fe41",
                "321e9cb7.9abef4"
            ]
        ]
    },
    {
        "id": "d93e226d.5444a8",
        "type": "inject",
        "z": "90243100.c40928",
        "name": "",
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "repeat": "60",
        "crontab": "",
        "once": true,
        "onceDelay": "5",
        "x": 130,
        "y": 280,
        "wires": [
            [
                "390315ac.56fdf2"
            ]
        ]
    },
    {
        "id": "dd366daf.ed20e8",
        "type": "ui_group",
        "z": "",
        "name": "Rückblick",
        "tab": "71dfb607.40b268",
        "order": 2,
        "disp": true,
        "width": 7,
        "collapse": false
    },
    {
        "id": "71dfb607.40b268",
        "type": "ui_tab",
        "z": "",
        "name": "Kamera",
        "icon": "cam",
        "order": 3,
        "disabled": false,
        "hidden": false
    }
]

```

Debug Output:

```auto
payload: 
"<div class="gallery" height="100%"> 
<div class="full-picture">
<div><a src="" name="1570644700650"></a><img src="../cam/1570644700650.jpg" /></div>
<div><a src="" name="1570644716164"></a><img src="../cam/1570644716164.jpg" /></div>
<div><a src="" name="1570644723246"></a><img src="../cam/1570644723246.jpg" /></div>
<div><a src="" name="1570644727842"></a><img src="../cam/1570644727842.jpg" /></div>
<div><a src="" name="1570672800031"></a><img src="../cam/1570672800031.jpg" /></div>
<div><a src="" name="1570683600031"></a><img src="../cam/1570683600031.jpg" /></div>
<div><a src="" name="1570770000026"></a><img src="../cam/1570770000026.jpg" /></div>
<div><a src="" name="1570856400028"></a><img src="../cam/1570856400028.jpg" /></div>
<div><a src="" name="1570942800031"></a><img src="../cam/1570942800031.jpg" /></div>
<div><a src="" name="1571029412335"></a><img src="../cam/1571029412335.jpg" /></div>
<div><a src="" name="1571115600035"></a><img src="../cam/1571115600035.jpg" /></div>
<div><a src=""..."

```

Dashboard html output:

```auto
<div class="full-picture">
<div><a src=""></a><img src="../cam/1570644700650.jpg"></div>
<div><a src=""></a><img src="../cam/1570644716164.jpg"></div>
<div><a src=""></a><img src="../cam/1570644723246.jpg"></div>
<div><a src=""></a><img src="../cam/1570644727842.jpg"></div>
<div><a src=""></a><img src="../cam/1570672800031.jpg"></div>
<div><a src=""></a><img src="../cam/1570683600031.jpg"></div>
<div><a src=""></a><img src="../cam/1570770000026.jpg"></div>
<div><a src=""></a><img src="../cam/1570856400028.jpg"></div>
<div><a src=""></a><img src="../cam/1570942800031.jpg"></div>
<div><a src=""></a><img src="../cam/1571029412335.jpg"></div>
<div><a src=""></a><img src="../cam/1571115600035.jpg"></div>
<div><a src=""></a><img src="../cam/1571202000029.jpg"></div>
<div><a src=""></a><img src="../cam/1571288400030.jpg"></div>
</div>

```

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [17 October 2019 14:52 UTC](https://discourse.nodered.org/t/dashboard-seems-to-filter-html/16816/3 "2019-10-17T14:52:40Z")

</div>

You probably need to add the trusted filter to tell angular not to filter...

```auto
<div ng-bind-html="msg.payload | trusted"></div>

```

---

<div class="post-metadata">

**Author:** ![drivin](https://avatars.discourse-cdn.com/v4/letter/d/8e7dd6/32.png) [@drivin](https://discourse.nodered.org/u/drivin)\
**Post date:** [18 October 2019 17:12 UTC](https://discourse.nodered.org/t/dashboard-seems-to-filter-html/16816/4 "2019-10-18T17:12:27Z")

</div>

Thank you so much! Now my dashboard works.
