User Guide
A simple Command example 139
Creating the UI
The UI is a form that contains two radio buttons that let the user select uppercase or lowercase.
The following example shows the HTML code to create the form:
<!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0//dialog">
<HTML>
<HEAD>
<!-- Copyright 2001-2002 Macromedia, Inc. All rights reserved. -->
<Title>Make Uppercase or Lowercase</Title>
<SCRIPT SRC="Change Selection Case.js"></SCRIPT>
</HEAD>
<BODY>
<form name="uorl">
<table border="0">
<!--DWLayoutTable-->
<tr>
<td valign="top" nowrap> <p>
<label>
<input type="radio" name="RadioGroup1" value="uppercase" checked>
Uppercase</label>
<br>
<label>
<input type="radio" name="RadioGroup1" value="lowercase">
Lowercase</label>
</p></td>
</tr>
</table>
</div>
</form>
</BODY>
</HTML>
The contents of the Title tag, Make Uppercase or Lowercase, appears in the top bar of the
dialog box. Within the form, a table with two cells controls the layout of the elements. Within the
table cells are the two radio buttons, Uppercase and Lowercase. The Uppercase button has the
checked attribute, making it the default selection and ensuring that the user must either select
one of the two buttons or cancel the command.
The form looks like the following figure.
The commandButtons() function supplies the OK and Cancel buttons that let the user submit
the choice or cancel the operation.
Save the HTML code as
ChangeCase.html in the Commands folder within the Dreamweaver
Configuration folder.