Answered by:
Best way to use NavBar to open external website

Question
-
Hi,
I want to use the NavBar to open external website (let's say Microsoft site for example).
The only way I find so far is to use the label and call a function to will evaluate the label name ...
<div data-win-control="WinJS.UI.NavBarCommand" data-win-options="{ label: 'Microsoft', icon: 'delete' }"></div>
WinJS.UI.Pages.define("index.html", {
ready: function (element, options) {
document.getElementById('createNavBar').addEventListener('invoked', this.navbarInvoked.bind(this));
document.getElementById('toggleNavBar').addEventListener('click', this.toggleNavBarVisibility.bind(this));
},navbarInvoked: function (ev)
{ var navbarCommand = ev.detail.navbarCommand; switch (navbarCommand.label) { case "Google": window.open('http://www.google.com', '_blank'); break; case "Microsoft": window.open('http://www.microsoft.com', '_blank'); break;
It's working... but I was wondering if there is a better way to do that?
Thanks!
Wednesday, August 20, 2014 8:54 PM
Answers
-
Hi Elezium38,
I don't think there is a best way, but there must be a suitable way. Your request is to open the external website in NavBar, so let's say we can separate the question into two parts:
#1 how to open external website
We can use the window.open as you wrote, to use LaunchUriAsync | launchUriAsync methods can do the same thing and even more with LauncherOptions. Here also some documentation for you: How to link to external web pages
#2 how to put a link or button on the NavBar
Basically NavBar is a container for NavBarCommands, see the documentation: Quickstart: Adding a nav bar, but you can also customize the navbar by adding a listview to it or etc.
I believe the design guideline documentation will definitely help you: App bars
<THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
Thanks
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.- Marked as answer by Jamles HezModerator Wednesday, August 27, 2014 10:20 AM
Thursday, August 21, 2014 6:18 AMModerator -
Thanks for the link and references.
It well really helpfulll!
Cheers!
- Marked as answer by Elezium38 Monday, September 1, 2014 3:06 PM
Monday, September 1, 2014 3:06 PM
All replies
-
Hi Elezium38,
I don't think there is a best way, but there must be a suitable way. Your request is to open the external website in NavBar, so let's say we can separate the question into two parts:
#1 how to open external website
We can use the window.open as you wrote, to use LaunchUriAsync | launchUriAsync methods can do the same thing and even more with LauncherOptions. Here also some documentation for you: How to link to external web pages
#2 how to put a link or button on the NavBar
Basically NavBar is a container for NavBarCommands, see the documentation: Quickstart: Adding a nav bar, but you can also customize the navbar by adding a listview to it or etc.
I believe the design guideline documentation will definitely help you: App bars
<THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
Thanks
MSDN Community Support
Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.- Marked as answer by Jamles HezModerator Wednesday, August 27, 2014 10:20 AM
Thursday, August 21, 2014 6:18 AMModerator -
Thanks for the link and references.
It well really helpfulll!
Cheers!
- Marked as answer by Elezium38 Monday, September 1, 2014 3:06 PM
Monday, September 1, 2014 3:06 PM