Animated Collapsible DIV

[Itlan]

1) Script Title: Animated Collapsible DIV

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...edcollapse.htm

3) Describe problem: Animated collapse is not persistent when multiple pages have collapsible DIVs. I modified the "uninit" to maintain the previous open DIVs and add only new ones. The result is as follows:

uninit:function(){
  var opendivids=new Array();//ITLAN
  var groupswithpersist='';
  var persistopenids=this.getCookie('acopendivids'); //ITLAN
  if (persistopenids!=null){  //ITLAN
    persistopenids=(persistopenids=='nada')? [] : persistopenids.split(',');  //ITLAN
  }
  else { persistopenids=new Array();}  //ITLAN
  opendivids=persistopenids; //ITLAN
  jQuery.each(this.divholders, function(){
    index=-1;
    index=jQuery.inArray(this.id, persistopenids); //ITLAN
    if (this.$divref.css('display')!='none'){
      if (index !=-1){ //ITLAN
        //Do nothing
      } 
      else{ //ITLAN
        opendivids.push(this.id); //store ids of DIVs that are expanded when page unloads: 'div1,div2,etc' //ITLAN
      }
    }
    else if (index !=-1) { //ITLAN
      opendivids.splice(this.id,1); //ITLAN
    }
    else{
    }
    if (this.getAttr('group') && this.getAttr('persist'))
      groupswithpersist+=this.getAttr('group')+','; //store groups with which at least one DIV has persistance enabled: 'group1,group2,etc'
  });
  if (opendivids!=null) opendivids=opendivids.join(','); //ITLAN
  opendivids = (opendivids=='') ? 'nada' : opendivids.replace(/,$/, '');
  groupswithpersist = (groupswithpersist=='') ? 'nada' : groupswithpersist.replace(/,$/, '');
  this.setCookie('acopendivids', opendivids);
  this.setCookie('acgroupswithpersist', groupswithpersist);
},

Lines that I added or modified are noted with //ITLAN.

I am not an expert JS programmer by any means, but the script didn't work as I expected when I used the persist on 3 different pages. It only remembered 1 page instead of all three.

Hope this helps some of you, or perhaps it will be added to the main script. Let me know if there is a better way, or maybe I forgot something.

Cheers,
Itlan

[ddadmin]

You shouldn't have to make additional changes to the script for persistence to work across pages, as long the pages are are all within the same domain (note that http://www.yoursite.com and http://yoursite.com are treated as separate domains). Do you have a URL to the problem page?

[Itlan]

You shouldn't have to make additional changes to the script for persistence to work across pages, as long the pages are are all within the same domain (note that http://www.yoursite.com and http://yoursite.com are treated as separate domains). Do you have a URL to the problem page?

The problem is that it only remembers 1 DIV name. So if I use it on several pages with different DIV names, it would only remember the last DIV that was saved in the open position.

Here is the login info: test/test

Here are 3 pages with the Animated Collasible DIVs (I've changed the script back to your original version):

• http://projectlog.cvc-inc.net/projects.php?&active=1
• http://projectlog.cvc-inc.net/news.php
• http://projectlog.cvc-inc.net/employees.php

If you open the Filter DIV on one page, then go to another page and open the DIV, then go back to the first page, the DIV will be closed. On the contrary, if you open a DIV, then navigate to another page and leave the DIV closed, then go back to the first page the DIV will be left open.

The way I fixed this was by retrieving the list of open DIVs from the cookie, removing any closed ones, adding any open ones, then saving the list back to the cookie. It works perfectly.

[ddadmin]

The way the script identifies if a DIV is the same one across pages is by its ID- whether it's the same, so yes, if on two pages the DIV carries a different ID, they have separate persistence settings. This is just the way the script is designed to work. Is there any reason why you can't give the same DIV across pages the same ID value?

[Itlan]

The way the script identifies if a DIV is the same one across pages is by its ID- whether it's the same, so yes, if on two pages the DIV carries a different ID, they have separate persistence settings. This is just the way the script is designed to work. Is there any reason why you can't give the same DIV across pages the same ID value?

Thanks for looking.

Of course I could do that but then I wouldn't be able to use it on different DIVs even on the same page. For instance, if you look at the News page, you can click on the "More" button of the new item. As you can see it would work for unlimited DIVs on one page, and across different pages.

I was just offering my changes for you to consider for future updates.

[Itlan]

I did a little more testing and found that I was saving the names of the open DIVs regardless of the 'persist' setting. So here is the revised 'uninit' method (revision highlighted):

uninit:function(){
  var opendivids=new Array();//ITLAN
  var groupswithpersist='';
  var persistopenids=this.getCookie('acopendivids'); //ITLAN
  if (persistopenids!=null){  //ITLAN
    persistopenids=(persistopenids=='nada')? [] : persistopenids.split(',');  //ITLAN
  }
  else { persistopenids=new Array();}  //ITLAN
  opendivids=persistopenids; //ITLAN
  jQuery.each(this.divholders, function(){
    index=-1;
    index=jQuery.inArray(this.id, persistopenids); //ITLAN
    if ((this.$divref.css('display')!='none') && this.getAttr('persist')) {
      if (index !=-1){ //ITLAN
        //open DIV already in cookie
      } 
      else{ //ITLAN
        //add DIV to cookie
        opendivids.push(this.id); //ITLAN
      }
    }
    else if (index !=-1) { //ITLAN
        //Remove DIV from cookie
      opendivids.splice(this.id,1); //ITLAN
    }
    else{
        //Do nothing
    }
    if (this.getAttr('group') && this.getAttr('persist'))
      groupswithpersist+=this.getAttr('group')+','; //store groups with which at least one DIV has persistance enabled: 'group1,group2,etc'
  });
  if (opendivids!=null) opendivids=opendivids.join(','); //ITLAN
  opendivids = (opendivids=='') ? 'nada' : opendivids.replace(/,$/, '');
  groupswithpersist = (groupswithpersist=='') ? 'nada' : groupswithpersist.replace(/,$/, '');
  this.setCookie('acopendivids', opendivids);
  this.setCookie('acgroupswithpersist', groupswithpersist);
},

Also should be noted I did not enhance the 'Groups with persist' part.