• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Chapter 10. Into the Great Beyond > Other Custom Classes

Other Custom Classes

In this final chapter, we have seen how to create some of the complex interfaces that the Dreamweaver API allows for. We learned about the wonderful graphic resources available in the Shared/MM/Images folder for dressing up our extensions. And we dipped our toes into the power of custom classes, such as ListControl, ImageButton, PageControl, and TabControl. You can take a look at Tables 10.6 and 10.7 for information on other custom classes related to interface development and specifications of custom form elements available for use .

Table 10.6. Custom Form Elements for Use in Dreamweaver Extension Interfaces (see Chapter 3 of the Extending Dreamweaver manual for full information on these)
Element Name Syntax Description
Color button (introduced in Chapter 2) HTML: <input type= "mmcolorbutton" name="myColor" value= "#FFFFFF" onChange="myFunction()"> Adds the standard Macromedia color button to a form; clicking on the button opens the color palette. (Used throughout the Dreamweaver interface.)
  JavaScript: var myColor = document.myForm. myColor.value; 
Combobox (editable <select> element) HTML: <select name="mySelect" editable="true" editText="any text"> Combines the functionality of an editable text field and a popup menu. Users can type in values or choose from predefined lists.
  JavaScript: (Used throughout the Dreamweaver interface.)
  var userChoice = document.myForm. mySelect.editText; 
Database controls (<select> element with special features) HTML: <select name="myDBTree" type="mmdatabasetree" connection="myConn" noexpandbuttons showHeaders></select> Useful for displaying database can also be added, to handle different numbers and widths of columns in the display grid.
  JavaScript: document.myForm.myDBTree. connection=myNewConn; 
Tree control HTML:

<mm:treecontrol name="myTree">

<mm:treecolumn name= "col1" width="100" value="Items">

<mm:treenode name= "item1" value="One" selected></mm:treenode>

<mm:treenode name= "item2" value="Two"> </mm:treenode>

<mm:treenode name= "item3" value="Three"> </mm:treenode>


Displays data in a hierarchical or grid format, with expanding/ collapsing nodes. (Used in the Keyboard Shortcuts editor and Tag Inspector, for instance.)

//add a node

document.myForm. myTree.col1.innerHTML+ ='<mm:treenode name= "Item4" value="Four"> <\/mm:treenode>'

//change a value

document.myForm.myTree. col1.item1.value= "First Choice";



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint