While creating application, a very common requirement you may come across is to dynamically navigate from one View to other on basis of some query parameter.
Consider a requirement from below diagram, when you click on a particular session, you need to navigate to session detail view.
We can list down the requirement as following
- We need to fetch Session ID from All Session View and pass it as input parameter to Session Detail view
- On Session Detail view fetch the data on basis of the Session Id passed from All Session View.
- Dynamically display Session Detail of a particular Session on Session Detail View.
At very first we need to set the query parameter in Template of All Session View as following. If you notice we are setting Session ID as query parameter in list view link button. On click of the detail button, application will be navigated to SessionDetails view with Session ID as value in query parameter.
Next Session Detail View is as below. Data-Show attribute of Session Detail View is set the function sessionDetailsShow. Whenever application will navigate to this view javascript function SessionDetails will be invoked
In SessionDetails function view Session ID can be read as following
Once you have value of Session ID passed from All Session View on Session Detail view, filter the data source on this Session ID. After fetching filtered data, data can be bind to Session Detail template as following.
Above code should be in SessionDetailShow function and you can define Template from Session Detail View as of your requirement
This is what all you need to do to do navigate from one view to other with data. I hope this post is useful. Thanks for reading.
Thanks for the tip Dhananjay. What happens when your data is too long for the query string? Show something using a post method or similar.