Iframe with dashboard and multiple links

Share Your Projects
1

Hi everyone, i was trying to make a custom navigation bar that uses the advantages of the dashboard, to the left and right you would have links and in the middle there is an iframe that loads the dashboard ui, this brought me a problem. If i wanted to navigate, the iframe would stuck in the first link i clicked, but if i selected a link that doesn't make reference to the ui dashboard it worked, so my solution was the following:

<html>
<head>
	<script>
	    var pag = "http://dirección_ip:1880/ui/#/0";
		function pagina(recibido)
		{
		    document.getElementById("paginaEmbebida").src = "about:blank";
			pag = recibido;
		}
		
		function prueba()
		{
			document.getElementById("paginaEmbebida").src = pag;
		}
	</script>
</head>
<body>
	<title>Página de navegación</title>
	<div>
		<a href="http://dirección_ip:1880/ui/#/0" target="PaginaEmbebida" onclick="pagina('http://dirección_ip:1880/ui/#/0')">General</a><br>
		<a href="http://dirección_ip:1880/ui/#/1" target="PaginaEmbebida" onclick="pagina('http://dirección_ip:1880/ui/#/1')">página 2</a><br>
	
		<iframe id="paginaEmbebida" name="PaginaEmbebida" width="100%" height="100%" onload="prueba()"></iframe>
	</div>
</body>
</html>

Of course that this could be improved, for starters it's not necessary to use the <a> tags, they could be easly replaced by buttons but it's an example.

I hope you find it usefull.