Puede añadir widgets a una página web arrastrando el contenido a la superficie Diseño del editor de IU enriquecida. Las acciones de arrastrar y soltar así como la interacción subsiguiente con el editor actualiza el código fuente para el manejador de IU enriquecida que está desarrollando.
De forma predeterminada, la paleta de widgets se encuentra en la parte derecha del editor, y la vista Datos está en la esquina inferior izquierda del entorno de trabajo.
handlers
MortgageCalculatorHandler

Para construir la IU para la calculadora:
inputRec

inputRec MortgageCalculationResult;



Acaba de personalizar las solicitudes para cada uno de los primeros campos de entrada de datos en el formulario que se está construyendo.



100Este valor es el mismo que la anchura predeterminada para el widget DojoCurrencyTextBox que ha utilizado para el importe del préstamo.

5
101530La ventana de valores debería tener un aspecto parecido a la siguiente imagen:

inputRec MortgageCalculationResult {term = 30};
function start() inputRec.term = 30; end
inputRec_term_controller Controller
{ @MVC {model = inputRec.term, view = inputRec_term_comboBox as Widget}};
La declaración del controlador asegura que el valor que ha asignado a la variable inputRec.term se utilizará para inicializar el recuadro combinado.

6Después de pulsar la superficie Diseño, las filas nuevas se visualizan por debajo de la fila Plazo.


buttonLayout



calculationButton
CalculateA continuación, debe enlazar el botón a una función que se ha creado cuando ha arrastrado la variable inputRec sobre el editor.

processImage
tools/spinner.gif
La imagen se encuentra en la carpeta com.ibm.egl.rui.dojo.samples/WebContent. El entorno de desarrollo trata las carpetas WebContent de todos los proyectos del espacio de trabajo como una única carpeta virtual.
paymentLabelUtilice aquí un widget de etiqueta porque el usuario no cambia este campo. La aplicación calcula y actualiza el contenido.
$0.00

errorLabel

En la próxima lección, añadirá código para dar soporte a la interfaz que acaba de crear.