Re: [Dynapi-Help] Widget tirggers event in another widget

Thu, 26 Apr 2001 04:54:54 -0700

Hi,
It seems to be an error in the onselect event of the list widget.
If you change this line:
    o.list.events.onselect=function(e){
To this:
    o.list.events.>
It works as it should.
Of course the real solution would be to debug the list widget, but I think you'll be better of writing your own slimmer version anyway.
 
Also, this line:
    this.id="selectList"+(selectList.Count++)
Should be deleted, as it can cause problems in the new API.
 
There were a few minor typo's in the code to , probably from pasting it, line 54 (o..addChild) and 90 (o..events).
Can I add the widget to my page?
 
Cheers,
Richard Bennett
 
[EMAIL PROTECTED]
www.richardinfo.com
(Everything running on, and ported to DynAPI2.51)
visit the DynAPI homepage (and FAQ) ::
http://dynapi.sourceforge.net/dynapi/index.php?menu=1
Browse (and search) the mailinglist here:
http://www.mail-archive.com/index.php3?hunt=dynapi
 
----- Original Message -----
From: Ben Empson
Sent: Thursday, April 26, 2001 1:05 PM
Subject: [Dynapi-Help] Widget tirggers event in another widget

I have built a select list widget, which when used once on a page works fine. However, when you add another (same) widget to the page, they each trigger the others onselect event. This I do not understand!
 
You can see what I mean here...
 
 
The alert that comes up when you select something is triggered in the onselect event for the selectList, and is the reference to the label which is the always visible part of the selectlist.
 
Thw widget code is below (selectlist2.js). Any help would be greatly appreciated.
 
Ben
 
----------------code start------------------
//define a function to set the list padding (not included in list.js)
List.prototype.setPadding = function(b){
 this.listStyle.padding = b;
 if (this.created) this.arrangeItems();
};
 
//imgW is the width of the arrow image to control the drop-down
//numItems is the number of items which will be added to the list
function selectList(x,y,w,h,imgW,numItems,maxDisplayItems,borderThickness,zIndex){
 this.superClass=DynLayer
 this.superClass()
 this.id="selectList"+(selectList.Count++)
 
 this.moveTo(x || 100, y || 100)
 this.setSize(w+(borderThickness*2)+100,h+(borderThickness*2))
 this.setZIndex(zIndex)
 
 var l=new EventListener(this)
 l.oncreate=function(e) {
  var o=e.getTarget()
  
  //o.label is the label which displays the selected item
  o.label = new Label('')
  o.label.moveTo(borderThickness,borderThickness)
  o.label.setBgColor('#eeeeee')
  o.label.setWidth(w-imgW)
  o.label.setHeight(h)
  
  //o.list is the drop-down list which presents the available options
  o.list = new List()
  o.list.moveTo(0,0-(numItems*h)) //move the list up so that it is hidden behind the label until the button is clicked
  o.list.setWidth(w+(borderThickness*2))
  o.list.setBgColor('#000000')
  o.list.boldOnSelect(true)
  o.list.setPadding(1)
  
  //o.button is the clickable button to activate the drop-down
  o.button = new DynLayer(null,(w-imgW)+borderThickness,0,imgW,h+borderThickness)
  o.button.imgUp = new Image()
  o.button.imgUp.src = " 'dynapi2_52/dynapi/src/lib/dynapi/images/scrollpane/arrowdn0.gif'  o.button.imgDn = new Image()
  o.button.imgDn.src = " 'dynapi2_52/dynapi/src/lib/dynapi/images/scrollpane/arrowdn1.gif'  o.button.setBgImage(o.button.imgUp.src)
  
  //set the borders of the whole widget
  o.topBorder = new DynLayer(null,0,0,w+(borderThickness*2),borderThickness,'black')
  o.bottomBorder = new DynLayer(null,0,h+borderThickness,w+(borderThickness*2),borderThickness,'black')
  o.leftBorder = new DynLayer(null,0,0,borderThickness,h+(borderThickness*2),'black')
  o.rightBorder = new DynLayer(null,w+borderThickness,0,borderThickness,h+(borderThickness*2),'black')
  
  //just insert o.?Border.setBgImage to create a styled border
  
  o.addChild(o.list)
  o..addChild(o.label)
  o.addChild(o.button)
  o.addChild(o.topBorder)
  o.addChild(o.bottomBorder)
  o.addChild(o.leftBorder)
  o.addChild(o.rightBorder)
  
  o.button.events = new EventListener(o.button)
   o.button.events.>    o.button.setBgImage(o.button.imgDn.src)
   }
 
   o.button.events.>    if (!o.open) {
     o.setSize(w+(borderThickness*2),(numItems*h)+h+(borderThickness*2))
     o.list.slideTo(0,h+(borderThickness*2),20,5)
     o.open=true
    } else {
     o.setSize(w+(borderThickness*2),h+(borderThickness*2))
     o.list.slideTo(0,0-((maxDisplayItems*h)-h),20,5)
     o.open=false
    }
    o.button.setBgImage(o.button.imgUp.src)
   }
  o.button.addEventListener(o.button.events)
  
  o.list.events = new EventListener(o.list)
   o.list.events.onselect=function(e){
    o.label.setHTML(o.list.getSelectedItem().getHTML())
    alert(o.label)
    o.open=false
    o.list.slideTo(0,0-((maxDisplayItems*h)-h),20,5)
    o.setSize(w+(borderThickness*2),h+(borderThickness*2))
   }
  o.list.addEventListener(o.list.events)
  
  o..events = new EventListener(o)
   o.events.>    if (o.open) {
     o.open=false
     o.list.slideTo(0,0-(numItems*h),20,5)
     o.setSize(w+(borderThickness*2),h+(borderThickness*2))
    }
   }
  o.addEventListener(o.events)
 }
 this.addEventListener(l)
 
 return this
}
selectList.Count=0
selectList.prototype=new DynLayer()
selectList.prototype.getSubClass=function() { return selectList }
-----------------code end----------------------

Reply via email to