prog2

Use the itemBox api: onShowContent().

case 1

Script:

// content is changed when we expand the box	
function changeContent(id,t){
 var theBox=itemHolder.getBoxById(id);		
 theBox.onShowContent=function (){
  theBox.setContent(t+":"+new Date().getTime());
 }		
}

case 2

We use bind to get access to the actual boxes values. Use of keywird this in var myFunc

Script:

// content is changed when we expand the box
function changeContent2(id){
  var theBox=itemHolder.getBoxById(id);
  var myFunc=function(){
    var t=this.getTitle();
    this.setContentHTML(t+" : "+new Date().getTime());
  }		
  theBox.onHideContent=myFunc.bind(theBox);		
}

case 3

We can achive the same functionallity by putting the button inside the box.
We also use on HideContent but this does of course not change the result since we dont see it before we show again.

Script:

// content is changed when we collapse the box
function changeContent3(t,id){
  var theBox=itemHolder.getBoxById(id);
  var myFunc=function(){
    var t=this.getTitle();
    this.setContentHTML(t+" "+this.getTitle()+" : "+new Date().getTime());
  }		
  theBox.onHideContent=myFunc.bind(theBox);		
}

case 4

We keep the button inside the box and let the box find out what it needs based on the fact that the button is a direct child of the content-element. Risky ?.

Script:

// content is changed when we collapse the box
function changeContent4(elt){
  // this is not safe. depends on elt direct child of content
  var id=elt.parentNode.getAttribute("id");
  var theBox=itemHolder.getBoxById(id);
  var myFunc=function(){
    var t=this.getTitle();
    this.setContentHTML("Hello from "+this.getTitle()+" at: "+new Date().getTime());
  }		
  theBox.onHideContent=myFunc.bind(theBox);		
}