How to serve different page request from same button dynamically? - jsf

I have a fix top navigation bar like this. And I have several links to pages(e.g. foods.xhtml, cars.xhtml, planes.xhtml) in side bar navigation(Like: "similar questions" side bar in stackoverflow, so its like inverted 'L').
Goal: Click on any sidebar link(from home page) and it should take me to the next page(let's say "foods.xhtml", which has list of foods) and when I click on any food it will take me to next page(let's say Sandwich.xhtml) and a back button to be created on fixed top navigation bar to navigate back tolist of foods(foods.xhtml).
Questions:
When I click on one sidebar link(->foods.xhtml), how can I store the
foods.xhtml in backing bean so that when I go to sandwich.xhtml and
want to navigate back, the "back" button on fixed navigation bar
will point to foods.xhtml?
Note:
I want this to work for cars, planes. So the "back" button in top fixed navigation bar has different "page redirection" at different page served.

Related

Add Nav buttons on left hand side of Navigation bar

I have a Xamarin page with a Navigation bar at the top.
I keep changing the views on the page with some button clicks, but the page remains the same.
What I need is, when I load a new view (say View A) on this page, I want to add a Back button on the top Nav bar of the page.
I saw some forums where they are using Custom page renderers to add Back button.
But here, the page remains the same. Only the view changes. So, I guess I need to use the custom view renderer to add the Navigation button.
How can I achieve this, as NavigationController which I need to add a Nav button is present in Page renderers, not View renderers.
I need some help.
Thanks
UIBarButtonItem customButton = new UIBarButtonItem(
UIImage.FromFile("Image/image.png"),
UIBarButtonItemStyle.Plain,
(sender, e) =>{
//InitView
});
NavigationItem.LeftBarButtonItem = customButton;
this.NavigationItem.LeftBarButtonItem.TintColor = UIColor.Orange;

Windows Phone 8.1 WinJS AppBar disappears when navigating to another page containing an AppBar

I have two Pivot pages each with their own unique AppBar. The second pivot page, is accessible through the first pivot page via the AppBar. However, when I visit the second pivot page, its corresponding AppBar is not there. At first I thought the AppBar was not being rendered, but I suspect that it is being rendered, and being hidden. Furthermore, when I press the back button, the AppBar corresponding the first page is also gone.
I've attempted doing the following in the ready block
WinJS.UI.processAll().done(function() {
/* Grab winControl for app bar, and show it */
})
But that didn't work. What is going on?
To solve the problem you need to give the appBar a different identifiers (id option of your appBar div tag) in everyone of your HTML pages.
P.S: don't forget to update id in your related JS code.

How to link top-level "section" navigation items when using Zurb Foundation's top bar navigation component?

I am building a site using the Zurb Foundation UI framework, and I am wondering how to go about top-level navigation links so that they work for both desktop and mobile visitors.
EDIT: Here's an example: http://meowzen.com/zurb-nav/
Section 1 <-- should take the visitor to a "section" page
--Sub-Section 1 <-- should take the visitor to a "sub-section" page
--Sub-Section 2 <-- ditto
--etc
In the example via the link above, you'll notice that all links work as expected on a large screen. However, when the responsive navigation kicks in (either by resizing the window or viewing the page on a mobile device), the "section" pages aren't accessible through the menu anymore.
Has anyone come up against this problem? Do you have any suggestions on how to go about this?
Many thanks in advance!
EDIT: Here are some options I have at the moment:
Option 1: Only show top-level 'sections' for the mobile navigation - here's an example: projection . pixar . com . <- I'm leaning towards this!
Option 2: Make the section names linkable - I believe it's possible because there's a working example here: emerilsrestaurants . com .
Option 3: Insert a dummy menu item for the section pages at the sub-section level .
In the example via the link above, you'll notice that all links work as expected on a large screen. However, when the responsive navigation kicks in (either by resizing the window or viewing the page on a mobile device), the "section" pages aren't accessible through the menu anymore.
I am not sure I am understanding you correctly, but your example is working as expected. For smaller viewports ("mobile" view) the menu is hidden in a dropdown component. Once you drop down the menu, sub-menu items are still navegable on click.

How to force a page to be displayed inside an ext:Panel?

This is about ext.net.
I have a link in West section, by clicking which, a webpage should be displayed in the Center section in a tab. But how to prevent the page from being rendered in a new browser window or tab (by shift click, or right click, then pick open in a new tab)?
I can suggest to use a LinkButton (if you really need your link to look as a link).
http://examples.ext.net/#/Buttons/Basic/LinkButton/
Handle its Click event and load any URL to the Center region.
App.PanelCenter.load({ url: "some URL" });
PanelCenter should be configured with a respective Loader.
Hope this helps.

On scroll pagination for richfaces

Is it possible to create lazy loading like pagination with richfaces? My idea would be to catch the event of scrolling on a specific page and then rerender a part of the page.
So the flow would be
create 10 search results on a search result page
if the user scrolls
Then reload the result region with 10 additional entries
An option would also be to create a Facebook like "more" bar and to rerender the region, when the user clicks on the button.
What do you guys think?
How about using the ScrollableDataTable ? Might not be what you want if your results are searchresults, but it might work still..
http://livedemo.exadel.com/richfaces-demo/richfaces/scrollableDataTable.jsf;?c=scrollableDataTable&tab=usage
If you want to automatically load more items as you scroll, you can create an anchor near the bottom of the page, and the detect when that anchor is visible, which will fire off an XHR request to re-load the component holding the results.

Resources