This is a migrated thread and some comments may be shown as answers.

Prevent view from being added to the navigation history

6 Answers 387 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
PHILIPP
Top achievements
Rank 1
PHILIPP asked on 07 Jun 2012, 02:00 PM
In my application I have 3 mobile view:
- Items-View, where the user selects an item,
- Options-View, where the user can specify additional options for some of the items, and
- Details-View, where the details about the selected item are displayed.

The Details view has a standard back button in the header area which should take the user back to the Items-View.

In the case the user was taken to the Options-View before navigating to the Details-View, the standard back button is taking the user to the Options-View rather than the Items-View (the workflow doesn't allow for them to choose another option, but rather to take them back to the Items-View).

I have used window.location.replace('#Results-View') when navigating from the Options-View page, which works correctly in Chrome on Windows, but fails on the iPhone.

So is there a way to either:  
- Remove (or don't add) the Options-View from the navigation history (so the button would work correctly), or
- When navigating to the Options-View from the Details-View to programmatically invoke the back navigation?

Update: using kendo.history.navigate('#:back') invokes the back navigation programmatically. While it works it still shows the Options-View temporarily 'on the way back'. Removing the Options-View from the navigation history all together would be preferred.

I have considered to convert the Options-View into a dialog, but I haven't found a dialog framework that looks and feels natural in this flow.

6 Answers, 1 is accepted

Sort by
0
Iliana Dyankova
Telerik team
answered on 11 Jun 2012, 12:49 PM
Hi Philipp,

For our next internal build we scheduled to include a functionality for explicit definition of the BackButton transition via its href attribute. So I would suggest to wait until the end of the current week when the internal build will be available. 

Regards,

Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
PHILIPP
Top achievements
Rank 1
answered on 11 Jun 2012, 04:18 PM
Thank you for your reply. Where will I be able to download the latest release from? Note, I am not a paying customer yet (but will be in time for my application to be released of course).
0
Iliana Dyankova
Telerik team
answered on 13 Jun 2012, 12:14 PM
Hello Philipp,

I am afraid the internal build is available for licensed users only. If you use the open source or the trial version, you will have to wait until the next official major version. 

Regards,
Iliana Nikolova
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Jeremy
Top achievements
Rank 1
answered on 18 Oct 2012, 05:25 PM
It appears that the issue raised by the OP may be a symptom of a larger issue, but please see my response below, and tell me if I'm mistaken.

I am having issues where pressing the back button causes my previous view to "slide" into view twice.  In other words, when the user navigates to a page, then taps the back button, the previous page slides into view, my initial page flickers on screen for a split-second, then the animation happens again.  The resulting page is what I expected, but the double-animation is unacceptable as it is very distracting for users and makes the app appear unstable.

On a related note, the double animation only seems to be happening the first time I click the Back button (going forward, and back again, the views animate as expected).  However, there are times when, for some reason, the animation flicker issues comes up again before going back to normal again.

I started digging into this issue to see if it was something I was doing, and it appears that the animation is, in fact, being fired twice, but the stack trace (as witnessed in the Chrome debug console) is different.  The first execution seems to be coming from the mouseup event, and the second animation is being triggered by the History change event.

This seemed a bit unusual, so I continued digging to investigate the history for the pane being managed by Kendo.  I noticed that there were many duplicate entries in the history list (app.pane.history).  It seems like hitting the back button should remove the current pane from the history list completely, but instead, the list continues to grow as the user continues to navigate forward and backward the application.

I hope this makes some sense.  I've been attempting to navigate through the (minified) Kendo libraries, hoping to find some silly error in my code, but was only left with unusual artifacts, and haven't been able to find anything in my code (yet) that might be causing this problem.

Any support you can provide is greatly appreciated, thanks!
0
Shawn
Top achievements
Rank 2
answered on 19 Oct 2012, 05:31 AM
Can you provide an example of using this href back navigation.

I have a 2 form application.

1. Logon Page.  When successfully logged in I use app.navigate to go to another html file.

2. Tabbed Page.  See below.

On the Tabbed Page I put in a button in the header and trapped the click event.  I ask if the user wants to logout and do an app.navigate back to the logon page.

This causes problems as it is calling init again and creating a new page which is causing all kinds of problems for me.

So I switched to try and use the back button which does not create a new page.

Bu the problem is that as I navigate through my tabs the back button takes me back through history.

I want to go to a specific page in history - how can I do that.

I am a licensed user.

Thanks for any help.

Shawn
0
Shawn
Top achievements
Rank 2
answered on 19 Oct 2012, 06:31 AM
OK I figured that out and it is pretty cool feature

It works either way:

<a class="nav-button" data-role="backbutton" data-align="left" href="app/logon.html">Logout</a>


<a class="nav-button" data-role="backbutton" data-align="left" href="#logon">Logout</a>

In this last one logon is the div id located in a separate html file than the one these back buttons are in.

My problem was that when I use app.navigate("logon.html") and the page ha been called before the data-init was fired again which of course will cause a bunch of issues.

Is there any way to remove the logon page from memory when I go away from that page so when I go back it will be re-created?

Now I have another problem with tabstrip and when I go back into the page that has already been rendered how do I selected a specific tab.

I used the above trick after the first logon I could just call the div id via app.navigate("#
first tab") and that worked except if I logged out when I was in the second tab the second tab button is still selected even though I am on the first tab.

Any help would be appreciated.

Tags
General Discussions
Asked by
PHILIPP
Top achievements
Rank 1
Answers by
Iliana Dyankova
Telerik team
PHILIPP
Top achievements
Rank 1
Jeremy
Top achievements
Rank 1
Shawn
Top achievements
Rank 2
Share this question
or