Confluence Docs 3.0 : UPT 2.3 - The Velocity Template This page last changed on Jul 06, 2006 by cmiller. Having written the model and the controller, it's now time to work on the view. Confluence views are written in Velocity. Our velocity template needs to draw a form. It needs to populate that form with the `UserInformation` object we loaded during the `doDefault` method of the EditUserInfoAction, and submit it back to the action for saving. I put the velocity file in `src/etc/templates/extra/userinfo/edituserinfo.vm`.
    <html>
    	<head>
    		<title>Edit Contact Details</title>
        </head>

            <body>
                <div class="thickPadded">
                    <form name="edituserinfo.form" method="POST" action="doedituserinfo.action">
                        <table class="greyBox" width="450" cellpadding="2" cellspacing="4">
                            #tag( TextField "label='Position'" "name='userInfo.position'" "size='50'" )
                            #tag( TextField "label='Office'" "name='userInfo.office'" "size='50'" )
                            #tag( TextField "label='Extension'" "name='userInfo.extension'" "size='4'" )

                            <tr><td colspan="2" >&nbsp;</td></tr>
                            #tag( TextField "label='Mobile Phone'" "name='userInfo.mobilePhone'" "size='20'" )
                            #tag( TextField "label='Other Phone'" "name='userInfo.otherPhone'" "size='20'" )
                            #tag( TextField "label='AOL Instant Messenger'" "name='userInfo.aimId'" "size='30'" )
                            #tag( TextField "label='MSN Messenger'" "name='userInfo.msnId'" "size='30'" )
                            #tag( TextField "label='Yahoo!'" "name='userInfo.yahooId'" "size='30'" )
                            #tag( TextField "label='Jabber'" "name='userInfo.jabberId'" "size='30'" )
                            #tag( TextField "label='ICQ'" "name='userInfo.icqId'" "size='10'" )
                            #tag( TextField "label='Skype'" "name='userInfo.skypeId'" "size='30'" )
        <tr>
            <td colspan="2" align="center">
                <br/>
                #tag( Submit "name='confirm'" "value='update.name'" "theme='notable'" )
                #tag( Submit "name='cancel'" "value='cancel.name'" "theme='notable'" )
            </td>
        </tr>
    </table>
    </form>
    </body>
    </html>
Here I'm taking advantage of WebWork Velocity tags to draw the form elements. The velocity tags take care of making the form elements part of the surrounding table, formatting them, filling them with their associated data, and if necessarily associating them with validation errors. Note that we've called each form `userInfo.propertyName`. This means that when we submit the form, XWork will call `getUserInfo().setPropertyName(value)` for each property, thus populating our UserInformation bean before it is saved in the `execute()` method. Note also that this HTML is lacking anything to define the Confluence look and feel. SiteMesh will take care of filling in the surrounding detail.

Document generated by Confluence on Nov 05, 2009 23:34