2

I make my own accordion menu with html + jquery its working perfectly to forth level, then i add a cookie code from net and do some extra work it also work 100% perfectly in html.

My complete HTML + jQuery code reference is in JS-Fiddle Accordion Menu with Cookie

Now i merge it in my wordpress menu very carefully, it shows very weird behavior. when i click on plus the sub menus are open and i click on sub category the page goes to that category but the menu is close but when i again open the sub menu and click on the menu or refresh the page its work. I worried why in wordpress the jquery cookie not working.

Here is jquery cookie + jquery accordion code:

jQuery(document).ready(function () {


   // baking cookie ;p
   function set_cookie(ID) {
         document.cookie = ID + "=opened";
   }

   // getting it out from the oven... ;)
   function get_cookies_array() {

       var cookies = {};

       if (document.cookie && document.cookie != '') {
          var split = document.cookie.split(';');
          for (var i = 0; i < split.length; i++) {
              var name_value = split[i].split("=");
              name_value[0] = name_value[0].replace(/^ /, '');
              cookies[decodeURIComponent(name_value[0])] = decodeURIComponent(name_value[1]);
          }
       }

       return cookies;

   }

   // yuck... sorry i don't know how to cook :S
   function unset_cookie(cookie_name) {
        var cookie_date = new Date();
        cookie_date.setTime(cookie_date.getTime() - 1);
        document.cookie = cookie_name += "=; expires=" + cookie_date.toGMTString();
   }

   var tree_id = 0;
   jQuery('ul.b29-tree li:has(ul)').addClass('has-child').prepend('<span class="switch">+</span>').each(function () {
                    tree_id++;
                    jQuery(this).attr('id', 'tree' + tree_id);
                });
   // Accordion code
   jQuery('ul.b29-tree li > span.switch').click(function () {
            var tree_id = jQuery(this).parent().attr('id');
            if (jQuery(this).hasClass('open')) {
                        jQuery(this).parent().find('ul:first').slideUp('fast');
                        jQuery(this).removeClass('open');
                        jQuery(this).text('+');
                        unset_cookie(tree_id)
                    } else {
                        jQuery(this).parent().find('ul:first').slideDown('fast');
                        jQuery(this).text('-');
                        jQuery(this).addClass('open');
                        set_cookie(tree_id)

                    }
                });

                var cookies = get_cookies_array();
                for (var name in cookies) {
                    $('#' + name).find('> ul').css({'display' : 'block'});
                    $('#' + name).find('> span').addClass('open').text('-');
                }

            });

I am working in wordpress on my xamp so i can't give you that link but above link is the demo of html

2

Ok,

I solve this with the help of @TheDeadMedic's help. I use wordpress cookiepath constant and it works on wordpress perfectly.

Here is the jquery code:

jQuery(document).ready(function () {
                // baking cookie ;p
                function set_cookie(ID) {
                    document.cookie = ID + "=opened; path=<?php echo COOKIEPATH ?>";
                }

                // getting it out from the oven... 
                function get_cookies_array() {
                    var cookies = {};

                    if (document.cookie && document.cookie != '') {
                        var split = document.cookie.split(';');
                        for (var i = 0; i < split.length; i++) {
                            var name_value = split[i].split("=");
                            name_value[0] = name_value[0].replace(/^ /, '');
                            cookies[decodeURIComponent(name_value[0])] = decodeURIComponent(name_value[1]);
                        }
                    }
                    return cookies;
                }

                // yuck... sorry i don't know how to cook :S
                function unset_cookie(cookie_name) {
                    var cookie_date = new Date();
                    cookie_date.setTime(cookie_date.getTime() - 1);
                    document.cookie = cookie_name += "=; expires=" + cookie_date.toGMTString() + "; path=<?php echo COOKIEPATH ?>";
                }

                var tree_id = 0;
                jQuery('ul.wpc-categories li:has(ul)').addClass('has-child').prepend('<span class="switch"><img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-plus.png" /></span>').each(function () {
                    tree_id++;
                    jQuery(this).attr('id', 'tree' + tree_id);
                });

                jQuery('ul.wpc-categories li > span.switch').click(function () {
                    var tree_id = jQuery(this).parent().attr('id');
                    if (jQuery(this).hasClass('open')) {
                        jQuery(this).parent().find('ul:first').slideUp('fast');
                        jQuery(this).removeClass('open');
                        jQuery(this).html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-plus.png" />');
                        unset_cookie(tree_id)
                    } else {
                        jQuery(this).parent().find('ul:first').slideDown('fast');
                        jQuery(this).html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-minus.png" />');
                        jQuery(this).addClass('open');
                        set_cookie(tree_id)
                    }
                });

                var cookies = get_cookies_array();
                for (var name in cookies) {
                    jQuery('#' + name).find('> ul').css({'display' : 'block'});
                    jQuery('#' + name).find('> span').addClass('open').html('<img src="<?php echo plugin_dir_url(__FILE__); ?>/includes/css/images/icon-minus.png" />');
                }
            });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.