Usingnamespace – Blog

Unfortunately, there are no « clean » way to limit the maximum number of characters (or more generally apply constraints) in edit mode of a tree, unlike textbox elements.

Here is the trick : the oninput event of a tree is only fired when you are editing :

Short tree example (limiting max number of characters to 10):

<tree hidecolumnpicker="true" minwidth="100px" height="300" editable="true" flex="1" 
 oninput="event.originalTarget.value = event.originalTarget.value.substring(0,10);">
  <treecols>
    <treecol primary="true" flex="1"/>
  </treecols>
  <treechildren context="">
    <treeitem>
      <treerow>
        <treecell label="joe@somewhere.com"/>
      </treerow>
    </treeitem>
    <treeitem>
      <treerow>
        <treecell label="mel@whereever.com"/>
      </treerow>
    </treeitem>
  </treechildren>
</tree>

This is a very small tip, but if you don’t know it you might loose a lot of time on it !

To have a menupopup bigger than it’s parent menulist just set the attribute sizetopopup on the menulist to none:

sizetopopup
Type: one of the following values
Indicates how the menu width and the menupopup width are determined. If the sizetopopup attribute is left out or set to none, the menu will be its preferred width and the popup may extend outside of this width, unaffected by the maximum width of the menu itself.

* none: The width of the popup will not be constrained to the size of the menu.
* always: If set to always, the menu’s width will be the same as that necessary for the menupopup . If the menu has a maximum width, the popup will also be this width.

https://developer.mozilla.org/en/XUL/menulist#a-sizetopopup