Hi, I am trying implement a dynamic breadcrumbs for Volt theme. But I am facing several problems. I am trying to use Jquery to read menuitem value like bellow:
<div class="breadcrumb">
<div class="item"><a href="#home">Home / </a></div>
</div>
And Mainly JS is:
$('.items a').on('click', function() {
var $this = $(this),
$bc = $('<div class="item"></div>');
$this.parents('li').each(function(n, li) {
var $a = $(li).children('a').clone();
$bc.prepend(' / ', $a);
});
$('.breadcrumb').html( $bc.prepend('<a href="#home">Home</a>') );
return false;
})
It works nice and displays menu value dynamically, But problem is this, when I click menuitem that contain action and then page reloads and clear the breadcrumbs.
Please advise. Any idea.
Dynamic Breadcrumbs Need
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
I think you can use jquery cookie plugin to restore item. You can add item list of breadcrumb into cookie array then you can create <li>, <a> and append them into breadcrumb component after loading page. I think these links can help to you;
http://stackoverflow.com/questions/9040 ... ery-cookie
http://stackoverflow.com/questions/1959 ... ery-cookie
http://stackoverflow.com/questions/1458 ... ith-jquery
Exp;
http://stackoverflow.com/questions/9040 ... ery-cookie
http://stackoverflow.com/questions/1959 ... ery-cookie
http://stackoverflow.com/questions/1458 ... ith-jquery
Exp;
Code: Select all
var cookieArray=[]
$(window).load(function()) {
if(cookieArray.length) {
/* create items from cookieArray */
}
$('.items a').on('click', function() {
/* push item value or ... to cookieArray */
});
// Other actions
}
Github Profile: https://github.com/mertsincan
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Glad to hear that you solved the problem, thanks for the update
Github Profile: https://github.com/mertsincan
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 12 guests