Set history and new URL after ic-get-from?
BoPeng opened this issue ยท 3 comments
I have multiple pages sharing the same navigation menu, set up as follows:
- A jinja2 based template
user_base.html
that loads the correct sub-panel using variablepanel
. Users can expand this page from URLs/users_update
,/users_emails
etc.
<nav class="menu position-relative" ic-target='#sub-panel'>
<a class="menu-item" ic-get-from="{{ url("users:update") }}"></i>Profile</a>
<a class="menu-item" ic-get-from="{{ url("users:emails") }}">Emails</a>
</nav>
<div id="sub-panel">
{% include("users/user_" + panel + ".html") %}
</div>
The jinja2 part does not matter because this is equivalent to multiple full pages with the same set of navigation menu. As you can imagine, this is converted from an old-style menu with
<a class="menu-item" href="{{ url("users:update") }}"></i>Profile</a>
where url("users:update")
contained complete pages.
- When
ic-get-from
is triggered,intercooler.js
would load only the included page and replace the content in#sub-panel
.
This layout works well but there are two problems:
-
When I enter the page through
/users_email
and AJAX to/users_profile
, the address bar stays at/users_email
, and/users_email
will be loaded if the user refresh the page. How can I set the URL to/user_email
afteric-get-from
? -
When I go to
/users_email
from/users_profile
, the history is not recorded and back button will not go to/users_email
. I understand that there are examples foric-history-elt
andic-push-url="true"
but I cannot figure out where I should put these meta data. Neithernav
nor#sub-panel
works.
Thanks,
@BoPeng On issue 1. - i think you're looking for http://intercoolerjs.org/attributes/ic-push-url.html (set ic-push-url="true"
). After that, your second issue should be resolved too, since ic-push-url
will auto-push URL to history.
Your links will be looking somewhat like:
<nav class="menu position-relative" ic-target='#sub-panel'>
<a class="menu-item" ic-get-from="{{ url("users:update") }}" ic-push-url="true">Profile</a>
<a class="menu-item" ic-get-from="{{ url("users:emails") }}" ic-push-url="true">Emails</a>
</nav>
Yep @scsmash3r is right. You should be able to move the ic-push-url="true" up to the nav element, as it is inherited.
If that isn't working let me know and I'll try to troubleshoot.
Thank you both! Putting ic-push-url
in nav
works like magic and it even knows what url to put there.
I love intercooler.js
.