4. Basic QForms
Calculator Example with "Design"
<< Calculator Example with Validation   |   Back to Main   |   * Introduction to QListControl >>

View Source
will open in a new window
Custom Renderers and Control Properties
In our final Calculator example, we show how you can use custom renderers to affect layout, as well as use control properties to change the appearance of your QControls.

The Qcodo distribution includes a sample custom renderer, RenderWithName, which is defined in your QControl custom class (which is at /includes/qform/QControl.inc). We'll use this RenderWithName for our calculator's textboxes and listbox. We've also made sure to assign Name properties to these QControls.

Note how "Value 1" and "Value 2" are in all caps and boldfaced, while "Operation" is not. This is because the textboxes are set to Required while the listbox is not. And the sample RenderWithName method has code which will boldface/allcaps the names of any required controls.

We've also made some changes to the styling and such to the various controls. Note that you can programmatically make these changes in our form definition (in Form_Create), and you can also make these changes as "Attribute Overrides" in the HTML template itself (see the "Other Tidbits" section for more information on Attribute Overriding). And finally, in our HTML template, we are now using the RenderWithName calls. Because of that, we no longer need to hard code the "Value 1" and "Value 2" HTML in the template.