The <form> tag allows you to create a web form and
provides automatic layout. Most components are laid out vertically
with buttons at the lower right. The data represented by components
that are enclosed in the form tag can be sent to the server using the
<submit> tag. Each form component, such as
checkbox, combobox or
radiogroup must have a name. The data is
submitted as name-value pairs, using the name and value of the
component.
<canvas height="200">
<dataset name="echoer" type="http" src="/@WEBAPP@/examples/components/echo.jsp"/>
<window id="win">
<form>
<submit name="survey" dataset="${echoer}"/>
<statictext>What is your favorite vacation spot?</statictext>
<radiogroup name="place">
<radiobutton>Hawaii</radiobutton>
<radiobutton>Paris</radiobutton>
<radiobutton>Jamaica</radiobutton>
</radiogroup>
<button isdefault="true" onclick="parent.survey.submit()">submit</button>
</form>
</window>
<view x="260" y="20" layout="class: simplelayout" datapath="echoer:/response">
<text text="Data received"/>
<view layout="axis: y">
<view datapath="formcomponent" layout="axis:x">
<text resize="true" datapath="@name"/>
<text text=":"/>
<text resize="true" datapath="text()"/>
</view>
</view>
</view>
</canvas>
If you want to include buttons in the form that are not placed in
the lower-right, you can specify placement="content" in
the button tag. To use a custom layout with a form, use the
<baseform> tag.
| Name (CSS property) | Type (tag) | Type (js) | Default | Category |
|---|---|---|---|---|
inset_bottom
|
expression | any | 10 | read/write |
| The bottom inset for content appearing within form. | ||||
inset_left
|
expression | any | 10 | read/write |
| The left inset for content appearing within form. | ||||
inset_right
|
expression | any | 10 | read/write |
| The right inset for content appearing within form. | ||||
inset_top
|
expression | any | 10 | read/write |
| The top inset for content appearing within form. | ||||
spacing
|
expression | any | 10 | read/write |
| Vertical space between content and button area. If forms height is specified, the button area will be flush against the form's bottom right corner (adjusted by any layout that the form has). | ||||
Attributes inherited from <view>
aaactive, aadescription, aaname, aasilent, aatabindex, align, backgroundrepeat, bgcolor, cachebitmap, capabilities, clickable, clickregion, clip, colortransform, context, contextmenu, cornerradius, cursor, fgcolor, focusable, focustrap, font, fontsize, fontstyle, frame, framesloadratio, hasdirectionallayout, hassetheight, hassetwidth, height, layout, loadratio, mask, opacity, pixellock, playing, proxyurl, resource, resourceheight, resourcewidth, rotation, shadowangle, shadowblurradius, shadowcolor, shadowdistance, showhandcursor, source, stretches, subviews, tintcolor, totalframes, unstretchedheight, unstretchedwidth, usegetbounds, valign, visibility, visible, width, x, xoffset, xscale, y, yoffset, yscale
Attributes inherited from <node>
classroot, cloneManager, data, datapath, defaultplacement, id, ignoreplacement, immediateparent, inited, initstage, name, nodeLevel, options, parent, placement, styleclass, subnodes, transition
Methods
Methods inherited from <view>
bringToFront, containsPt, getAttributeRelative, getBounds, getColor, getColorTransform, getCurrentTime, getDepthList, getDisplayObject, getID3, getMouse, getNextSelection, getPan, getPrevSelection, getProxyURL, getTotalTime, getVolume, init, isBehind, isInFrontOf, isMouseOver, measureHeight, measureWidth, play, proxyurl, searchSubviews, seek, sendAAEvent, sendBehind, sendInFrontOf, sendToBack, setAccessible, setAttributeRelative, setColor, setColorTransform, setPan, setProxyPolicy, setSource, setVolume, shouldYieldFocus, stop, unload, updateResourceSize
Methods inherited from <node>
animate, applyConstraintMethod, applyData, childOf, completeInstantiation, construct, createChildren, dataBindAttribute, destroy, determinePlacement, getOption, getUID, init, lookupSourceLocator, releaseConstraint, releaseConstraintMethod, searchImmediateSubnodes, searchSubnodes, setOption, setSelected, updateData
Events
Events inherited from <view>
onaddsubview, onbackgroundrepeat, onblur, onclick, onclickable, onclip, oncontext, oncornerradius, ondblclick, onerror, onfocus, onframe, onframesloadratio, ongesture, onheight, onkeydown, onkeyup, onlastframe, onload, onloadratio, onmousedown, onmousedragin, onmousedragout, onmouseout, onmouseover, onmousetrackout, onmousetrackover, onmousetrackup, onmouseup, onmouseupoutside, onopacity, onplay, onplaying, onremovesubview, onshadowangle, onshadowblurradius, onshadowcolor, onshadowdistance, onstop, ontimeout, ontouch, onvisible, onwidth, onx, ony