[Dojo-interest] Changing a custom widget style programmatically

Robert Coup robert.coup at onetrackmind.co.nz
Mon Nov 6 13:02:21 MST 2006

Yoav Rubin wrote:
> I created a custom widget (actually i just tweaked the memo widget 
> from the dojo book), but i can't find a way to change it's appearance 
> programmatically.  In the memo example if the user presses on the 'X' 
> the memo is closed, i need somehow to access the widget's style and 
> change it's border when cursor is above the widget. So i attached to 
> the widget the onmouseover event, and the function is called properly, 
> but i can't change the border, because the change doesn't reflect on 
> the displayed widget.
> Does anyone has any idea what to do
You can look at the widget and see the HTML template structure...

<div class="memo">
  <div class="title">$\\{this.title\\}</div>
  <div class="close" dojoAttachEvent="onClick">X</div>
  <div class="contents" dojoAttachPoint="containerNode"></div>

The outer node is usually available via .domNode, and any others are 
connected via dojoAttachPoint. So in the above example .containerNode 
will also be valid.
(see http://manual.dojotoolkit.org/WikiHome/DojoDotBook/Book56)

So the easiest case may be:

  this.domNode.style.border = "2px solid red";

Rob :)

One Track Mind Ltd.
PO Box 1604, Shortland St, Auckland, New Zealand
Phone +64-9-966 0433 Mobile +64-21-572 632
Web http://www.onetrackmind.co.nz 

More information about the Dojo-interest mailing list