Dear Wiki user, You have subscribed to a wiki page or wiki category on "Shale Wiki" for change notification.
The following page has been changed by Hermod Opstvedt: http://wiki.apache.org/shale/CreatingClayComponents ------------------------------------------------------------------------------ Back to our name panel, there is one thing that we need to decide. What to use as the outermost container? As you may know JSF builds a component tree and uses POST to send data from the client to the server and that requires a form. Since we are going to add more components to our page that carry data, we choose to use a tag that is frequently (container) used within a form: Fieldset. So this will be our container. Now our componet looks likes this: {{{ - <component jsfid="namepanel" extends="clay" id="namepanel"> + <component jsfid="namepanel" extends="clay" id="namepanel"> - <element jsfid="t:htmlTag" renderId="1" id="namefieldset"> + <element jsfid="t:htmlTag" renderId="1" id="namefieldset"> - <attributes> + <attributes> - <set name="value" value="fieldset" /> + <set name="value" value="fieldset" /> - </attributes> + </attributes> - <element jsfid="t:htmlTag" renderId="1" id="namelegend"> + <element jsfid="t:htmlTag" renderId="1" id="namelegend"> - <attributes> - <set name="value" value="legend" /> - </attributes> + <attributes> + <set name="value" value="legend" /> + </attributes> - <element jsfid="outputText" renderId="1"> + <element jsfid="outputText" renderId="1"> - <attributes> - <set name="value" - value="#{messages['namepanel.text']}"> - </set> - </attributes> - </element> - </element> + <attributes> + <set name="value" + value="#{messages['namepanel.text']}"> + </set> + </attributes> + </element> + </element> - <element jsfid="gltic" renderId="2" id="firstname"> + <element jsfid="gltic" renderId="2" id="firstname"> - <symbols> - <set name="ltName" - value="#{messages['firstname.label']}"> - </set> - <set name="ltValue" + <symbols> + <set name="ltName" + value="#{messages['firstname.label']}"> + </set> + <set name="ltValue" - value="[EMAIL PROTECTED]'firstname']}"> + value="[EMAIL PROTECTED]'firstname']}"> - </set> - </symbols> - </element> + </set> + </symbols> + </element> - <element jsfid="t:htmlTag" renderId="3" id="navnbr"> + <element jsfid="t:htmlTag" renderId="3" id="namebr"> - <attributes> - <set name="value" value="br" /> - </attributes> - </element> + <attributes> + <set name="value" value="br" /> + </attributes> + </element> - <element jsfid="gltic" renderId="4" id="lastname"> + <element jsfid="gltic" renderId="4" id="lastname"> - <symbols> - <set name="ltName" - value="#{messages['lastname.label']}"> - </set> - <set name="ltValue" + <symbols> + <set name="ltName" + value="#{messages['lastname.label']}"> + </set> + <set name="ltValue" - value="[EMAIL PROTECTED]'lastname']}"> + value="[EMAIL PROTECTED]'lastname']}"> - </set> - </symbols> - </element> - </element> + </set> + </symbols> + </element> + </element> - </component> + </component> }}} @@ -307, +307 @@ To refine this you can substitute the zipcode field with a combobox that gets its values from the Post beans getZipcodes method (This is shown in the downloadable finished application). The HTML definition for it is: {{{ - <select value="@zipcodeFelt" allowBody="true"> + <select value="@zipcodeField" allowBody="true"> <option value="@zipcodesList" /> </select> }}}
