lenamtl
asked on
how to add cookie.js to remember menu state
Hi,
I want to add cookie.js to a menu that will remember the state menu
jQuery cookie https://github.com/carhartl/jquery-cookie
There are some good example on the web but I cannot to adapt it to this menu and I have to use this menu
I cannot change for another one
This is the original menu js code
This is what have tried and this is not working
Let me know if you need more code part
Thanks
I want to add cookie.js to a menu that will remember the state menu
jQuery cookie https://github.com/carhartl/jquery-cookie
There are some good example on the web but I cannot to adapt it to this menu and I have to use this menu
I cannot change for another one
This is the original menu js code
(function($) {
"use strict";
$.fn.tree = function() {
return this.each(function() {
var btn = $(this).children("a").first();
var menu = $(this).children(".treeview-menu").first();
var isActive = $(this).hasClass('active');
//initialize already active menus
if (isActive) {
menu.show();
btn.children(".fa-angle-left").first().removeClass("fa-angle-left").addClass("fa-angle-down");
}
//Slide open or close the menu on link click
btn.click(function(e) {
e.preventDefault();
if (isActive) {
//Slide up to close menu
menu.slideUp();
isActive = false;
btn.children(".fa-angle-down").first().removeClass("fa-angle-down").addClass("fa-angle-left");
btn.parent("li").removeClass("active");
} else {
//Slide down to open menu
menu.slideDown();
isActive = true;
btn.children(".fa-angle-left").first().removeClass("fa-angle-left").addClass("fa-angle-down");
btn.parent("li").addClass("active");
}
});
/* Add margins to submenu elements to give it a tree look */
menu.find("li > a").each(function() {
var pad = parseInt($(this).css("margin-left")) + 10;
$(this).css({"margin-left": pad + "px"});
});
});
};
This is what have tried and this is not working
(function($) {
"use strict";
$.fn.tree = function() {
[b] return this.each(function(e) {
var checkCookie = $.cookie("nav-item");
if (checkCookie != "") {
$('.treeview:eq('+checkCookie+')').addClass('active').next().show();
}[/b]
var btn = $(this).children("a").first();
var menu = $(this).children(".treeview-menu").first();
var isActive = $(this).hasClass('active');
//initialize already active menus
if (isActive) {
menu.show();
btn.children(".fa-angle-left").first().removeClass("fa-angle-left").addClass("fa-angle-down");
[b] $.cookie("nav-item", menu);[/b]
}
//Slide open or close the menu on link click
btn.click(function(e) {
e.preventDefault();
if (isActive) {
//Slide up to close menu
menu.slideUp();
isActive = false;
btn.children(".fa-angle-down").first().removeClass("fa-angle-down").addClass("fa-angle-left");
btn.parent("li").removeClass("active");
} else {
//Slide down to open menu
menu.slideDown();
isActive = true;
btn.children(".fa-angle-left").first().removeClass("fa-angle-left").addClass("fa-angle-down");
btn.parent("li").addClass("active");
}
});
Let me know if you need more code part
Thanks
please provide some sample HTML so we can test your code, or a link to your page.
ASKER
Hi,
You can download the template I'm using
https://github.com/almasaeed2010/AdminLTE
I have used the 'Accepted Solution' from my previous question to embed the menu
https://www.experts-exchange.com/questions/28420334/include-html-file-with-javascript.html
You can download the template I'm using
https://github.com/almasaeed2010/AdminLTE
I have used the 'Accepted Solution' from my previous question to embed the menu
https://www.experts-exchange.com/questions/28420334/include-html-file-with-javascript.html
The idea should be to remove all active, set cookie content active and click the button
ASKER
Still need help with this ...
Is there a way without rewriting the entire menu code?
Is there a way without rewriting the entire menu code?
Your cookie is set to a jQuery object. That cannot work well
$.cookie("nav-item", menu);
should likely be
$.cookie("nav-item", menu.attr("id"));
or something
$.cookie("nav-item", menu);
should likely be
$.cookie("nav-item", menu.attr("id"));
or something
ASKER
I still need help with this
I'm tring to figure out but I have no luck
I'm tring to figure out but I have no luck
That is not very helpful.
Does the cookie get set?
Does it contain the correct information?
Are there any error messages in the console?
Do you have a site where we can see the menu in action?
Does the cookie get set?
Does it contain the correct information?
Are there any error messages in the console?
Do you have a site where we can see the menu in action?
ASKER
Yes it is set but it is empty
No error message
No live link available
The code I'm using is available from the link I have provided in my first post plus the code I use to modify see the EE link.
I will retry and get back monday
No error message
No live link available
The code I'm using is available from the link I have provided in my first post plus the code I use to modify see the EE link.
I will retry and get back monday
ASKER
I'm wondering is localstorage will be easier to use instead of cookie.js
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Please share your solution
i have same problem, plz share your solutions. thanks