You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@wicket.apache.org by ad...@apache.org on 2013/11/11 23:13:16 UTC
svn commit: r1540864 [2/38] - in /wicket/common/site/trunk/_site/guide: ./
gapi/ gapi/DefaultPackage/ gapi/spring/ guide/ guide/pages/
guide/src/docs/guide/ guide/src/docs/img/ guide/src/docs/imgOrigin/ img/
Modified: wicket/common/site/trunk/_site/guide/guide/chapter11.html
URL: http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/chapter11.html?rev=1540864&r1=1540863&r2=1540864&view=diff
==============================================================================
--- wicket/common/site/trunk/_site/guide/guide/chapter11.html (original)
+++ wicket/common/site/trunk/_site/guide/guide/chapter11.html Mon Nov 11 22:13:12 2013
@@ -2,7 +2,7 @@
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
- <title>11 Wicket forms in detail 6.x</title>
+ <title>12 Wicket forms in detail 6.x</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" href="../css/main.css" type="text/css" media="screen, print" title="Style" charset="utf-8"/>
<link rel="stylesheet" href="../css/pdf.css" type="text/css" media="print" title="PDF" charset="utf-8"/>
@@ -27,79 +27,82 @@ function addJsClass() {
<div class="toc-item" style="margin-left:0"><a href="../guide/chapter1.html"><strong>1</strong><span>Introduction</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter2.html"><strong>2</strong><span>Why should I learn Wicket?</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/howToSource.html"><strong>2</strong><span>How to use the example code</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter3.html"><strong>3</strong><span>Wicket says “Hello world!”</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter2.html"><strong>3</strong><span>Why should I learn Wicket?</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter4.html"><strong>4</strong><span>Wicket as page layout manager</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter3.html"><strong>4</strong><span>Wicket says “Hello world!”</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter5.html"><strong>5</strong><span>Keeping control over HTML</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter4.html"><strong>5</strong><span>Wicket as page layout manager</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter6.html"><strong>6</strong><span>Components lifecycle</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter5.html"><strong>6</strong><span>Keeping control over HTML</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter7.html"><strong>7</strong><span>Page versioning and caching</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter6.html"><strong>7</strong><span>Components lifecycle</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter8.html"><strong>8</strong><span>Under the hood of the request processing</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter7.html"><strong>8</strong><span>Page versioning and caching</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter9.html"><strong>9</strong><span>Wicket Links and URL generation</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter8.html"><strong>9</strong><span>Under the hood of the request processing</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter10.html"><strong>10</strong><span>Wicket models and forms</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter9.html"><strong>10</strong><span>Wicket Links and URL generation</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter11.html"><strong>11</strong><span>Wicket forms in detail</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter10.html"><strong>11</strong><span>Wicket models and forms</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter12.html"><strong>12</strong><span>Displaying multiple items with repeaters</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter11.html"><strong>12</strong><span>Wicket forms in detail</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter13.html"><strong>13</strong><span>Internationalization with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter12.html"><strong>13</strong><span>Displaying multiple items with repeaters</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter14.html"><strong>14</strong><span>Resource management with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter13.html"><strong>14</strong><span>Internationalization with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter15.html"><strong>15</strong><span>An example of integration with JavaScript</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter14.html"><strong>15</strong><span>Resource management with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter16.html"><strong>16</strong><span>Wicket advanced topics</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter15.html"><strong>16</strong><span>An example of integration with JavaScript</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter17.html"><strong>17</strong><span>Working with AJAX</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter16.html"><strong>17</strong><span>Wicket advanced topics</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter18.html"><strong>18</strong><span>Integration with enterprise containers</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter17.html"><strong>18</strong><span>Working with AJAX</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter19.html"><strong>19</strong><span>Security with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter18.html"><strong>19</strong><span>Integration with enterprise containers</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter20.html"><strong>20</strong><span>Test Driven Development with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter19.html"><strong>20</strong><span>Security with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter21.html"><strong>21</strong><span>Test Driven Development with Wicket and Spring</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter20.html"><strong>21</strong><span>Test Driven Development with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter22.html"><strong>22</strong><span>Wicket Best Practices</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter21.html"><strong>22</strong><span>Test Driven Development with Wicket and Spring</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter23.html"><strong>23</strong><span>Working with Maven (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter22.html"><strong>23</strong><span>Wicket Best Practices</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter24.html"><strong>24</strong><span>Project WicketStuff (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter23.html"><strong>24</strong><span>Working with Maven (Appendix)</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter25.html"><strong>25</strong><span>Lost In Redirection With Apache Wicket (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter24.html"><strong>25</strong><span>Project WicketStuff (Appendix)</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter26.html"><strong>26</strong><span>Contributing to this guide (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter25.html"><strong>26</strong><span>Lost In Redirection With Apache Wicket (Appendix)</span></a>
+ </div>
+
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter26.html"><strong>27</strong><span>Contributing to this guide (Appendix)</span></a>
</div>
</div>
@@ -129,18 +132,18 @@ function addJsClass() {
<div id="main" class="corner-all">
- <div class="toc-item prev-left"><a href="../guide/chapter10.html"><< <strong>10</strong><span>Wicket models and forms</span></a></div>
+ <div class="toc-item prev-left"><a href="../guide/chapter10.html"><< <strong>11</strong><span>Wicket models and forms</span></a></div>
<span id='toggle-col1' class="toggle">(<a href="#" onclick="localToggle(); return false;">Quick Reference</a>)</span>
- <div class="toc-item next-right"><a href="../guide/chapter12.html"><strong>12</strong><span>Displaying multiple items with repeaters</span> >></a></div>
+ <div class="toc-item next-right"><a href="../guide/chapter12.html"><strong>13</strong><span>Displaying multiple items with repeaters</span> >></a></div>
<div class="project">
- <h1>11 Wicket forms in detail - Reference Documentation</h1>
+ <h1>12 Wicket forms in detail - Reference Documentation</h1>
<p><strong>Authors:</strong> Andrea Del Bene, Carsten Hufe, Christian Kroemer, Daniel Bartl, Paul BorÈ</p>
@@ -153,40 +156,40 @@ function addJsClass() {
<div id="table-of-content">
<h2>Table of Contents</h2>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_1"><strong>11.1</strong><span>Default form processing</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_1"><strong>12.1</strong><span>Default form processing</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_2"><strong>11.2</strong><span>Form validation and feedback messages</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_2"><strong>12.2</strong><span>Form validation and feedback messages</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_3"><strong>11.3</strong><span>Input value conversion</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_3"><strong>12.3</strong><span>Input value conversion</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_4"><strong>11.4</strong><span>Submit form with an IFormSubmittingComponent</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_4"><strong>12.4</strong><span>Submit form with an IFormSubmittingComponent</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_5"><strong>11.5</strong><span>Nested forms</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_5"><strong>12.5</strong><span>Nested forms</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_6"><strong>11.6</strong><span>Multi-line text input</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_6"><strong>12.6</strong><span>Multi-line text input</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_7"><strong>11.7</strong><span>File upload</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_7"><strong>12.7</strong><span>File upload</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_8"><strong>11.8</strong><span>Creating complex form components with FormComponentPanel</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_8"><strong>12.8</strong><span>Creating complex form components with FormComponentPanel</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_9"><strong>11.9</strong><span>Stateless form</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_9"><strong>12.9</strong><span>Stateless form</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_10"><strong>11.10</strong><span>Working with radio buttons and checkboxes</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_10"><strong>12.10</strong><span>Working with radio buttons and checkboxes</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_11"><strong>11.11</strong><span>Selecting multiple values with ListMultipleChoices and Palette</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_11"><strong>12.11</strong><span>Selecting multiple values with ListMultipleChoices and Palette</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter11_12"><strong>11.12</strong><span>Summary</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter11_12"><strong>12.12</strong><span>Summary</span></a>
</div>
</div>
@@ -194,11 +197,11 @@ function addJsClass() {
-<h1 id="chapter11">11 Wicket forms in detail</h1>
+<h1 id="chapter11">12 Wicket forms in detail</h1>
In the previous chapter we have only scratched the surface of Wicket forms. The Form component was not only designed to collect user input but also to extend the semantic of the classic HTML forms with new features.<p class="paragraph"/>One of such features is the ability to work with nested forms (they will be discussed in paragraph 10.5).<p class="paragraph"/>In this chapter we will continue to explore Wicket forms learning how to master them and how to build effective and user-proof forms for our web applications.
-<h2 id="chapter11_1">11.1 Default form processing</h2>
+<h2 id="chapter11_1">12.1 Default form processing</h2>
<p class="paragraph"/>In paragraph 9.3 we have seen a very basic usage of the Form component and we didn't pay much attention to what happens behind the scenes of form submission. In Wicket when we submit a form we trigger the following steps on server side:
<ol>
<li>Form validation: user input is checked to see if it satisfies the validation rules set on the form. If validation fails, step number 2 is skipped and the form should display a feedback message to explain to user what went wrong. During this step input values (which are simple strings sent with a web request) are converted into Java objects. In the next paragraphs we will explore the infrastructures provided by Wicket for the three sub-tasks involved with form validation, which are: conversion of user input into objects, validation of user input, and visualization of feedback messages.</li>
@@ -209,7 +212,7 @@ Please note that the model of form compo
</blockquote><p class="paragraph"/>Without going into too much detail, we can say that the first two steps of form processing correspond to the invocation of one or more Form's internal methods (which are declared protected and final). Some examples of these methods are validate(), which is invoked during validation step, and updateFormComponentModels(), which is used at the step that updates the form field models.<p class="paragraph"/>The whole form processing is started invoking public method process(IFormSubmitter) (Later in paragraph 10.4 we will introduce interface IFormSubmitter).
-<h2 id="chapter11_2">11.2 Form validation and feedback messages</h2>
+<h2 id="chapter11_2">12.2 Form validation and feedback messages</h2>
<p class="paragraph"/>A basic example of a validation rule is to make a field required. In paragraph 9.3.2 we have already seen how this can be done calling setRequired(true) on a field. However, to set a validation rule on a FormComponent we must add the corresponding validator to it.<p class="paragraph"/>A validator is an implementation of the org.apache.wicket.validation.IValidator interface and the FormComponent has a version of method add which takes as input a reference of this interface.<p class="paragraph"/>For example if we want to use a text field to insert an email address, we could use the built-in validator EmailAddressValidator to ensure that the inserted input will respect the email format <a href="http://en.wikipedia.org/wiki/Email_address" target="blank">local-part@domain</a> :<p class="paragraph"/><div class="code"><pre>TextField email = <span class="java-keyword">new</span> TextField(<span class="java-quote">"email"</span>);
email.add(<span class="java-keyword">new</span> EmailAddressValidator());</pre></div><p class="paragraph"/>Wicket comes with a set of built-in validators that should suit most of our needs. We will see them in paragraph 10.2.3.<p class="paragraph"/><h3>Feedback messages and localization</h3><p class="paragraph"/>Wicket generates a feedback message for each field that doesn't satisfy one of its validation rules. For example the message generated when a required field is left empty is the following<p class="paragraph"/><code>Field '<label>' is required.</code><p class="paragraph"/><label> is the value of the label model set on a FormComponent with method setLabel(IModel <String> model). If such model is not provided, component id will be used as the default value.<p class="paragraph"/>The entire infrastructure of feedback messages is built on top of the Java internationalization (I18N) support and it uses <a href="http://docs.oracle.com/javase/tutorial/i18n
/resbundle/index.html" target="blank">resource bundles</a> to store messages.<p class="paragraph"/><blockquote class="note">
The topics of internationalization will be covered in chapter 12. For now we will give just few notions needed to understand the examples from this chapter.
@@ -274,7 +277,7 @@ Remember that component model is updated
}</pre></div><p class="paragraph"/>The two feedback panels must be filtered in order to display just the messages with a given level of severity (ERROR for validator message and SUCCESS for form's flash message). Unfortunately the built-in message filter ErrorLevelFeedbackMessageFilter is not suitable for this task because its filter condition does not check for an exact error level (the given level is used as lower bound value). As a consequence, we had to build a custom filter (inner class ExactErrorLevelFilter) to accept only the desired severity level (see method accept of interface IFeedbackMessageFilter).
-<h2 id="chapter11_3">11.3 Input value conversion</h2>
+<h2 id="chapter11_3">12.3 Input value conversion</h2>
<p class="paragraph"/>Working with Wicket we will rarely need to worry about conversion between input values (which are strings because the underlying HTTP protocol) and Java types because in most cases the default conversion mechanism will be smart enough to infer the type of the model object and perform the proper conversion. However, sometimes we may need to work under the hood of this mechanism to make it properly work or to perform custom conversions. That's why this paragraph will illustrate how to control input value conversion.<p class="paragraph"/>The component that is responsible for converting input is the FormComponent itself with its convertInput() method. In order to convert its input a FormComponent must know the type of its model object. This parameter can be explicitly set with method setType(Class<?> type):<p class="paragraph"/><div class="code"><pre>//<span class="java-keyword">this</span> field must receive an integer value
TextField integerField = <span class="java-keyword">new</span> TextField(<span class="java-quote">"number"</span>, <span class="java-keyword">new</span> Model()).setType(<span class="java-object">Integer</span>.class));</pre></div><p class="paragraph"/>If no type has been provided, FormComponent will try to ask its model for this information. The PropertyModel and CompoundPropertyModel models can use reflection to get the type of object model. By default, if FormComponent can not obtain the type of its model object in any way, it will consider it as a simple String.<p class="paragraph"/>Once FormComponent has determined the type of model object, it can look up for a converter, which is the entity in charge of converting input to Java object and vice versa. Converters are instances of org.apache.wicket.util.convert.IConverter interface and are registered by our application class on start up.<p class="paragraph"/>To get a converter for a specific type we must call meth
od getConverter(Class<C> type) on the interface IConverterLocator returned by Application's method getConverterLocator():<p class="paragraph"/><div class="code"><pre>//retrieve converter <span class="java-keyword">for</span> <span class="java-object">Boolean</span> type
Application.get().getConverterLocator().getConverter(<span class="java-object">Boolean</span>.class);</pre></div><p class="paragraph"/><blockquote class="note">
@@ -338,7 +341,7 @@ If the user input can not be converted t
</blockquote>
-<h2 id="chapter11_4">11.4 Submit form with an IFormSubmittingComponent</h2>
+<h2 id="chapter11_4">12.4 Submit form with an IFormSubmittingComponent</h2>
<p class="paragraph"/>Besides submitting forms with a standard HTML submit button, Wicket allows us to use special components which implement interface IFormSubmittingComponent. This entity is a subinterface of IFormSubmitter:<p class="paragraph"/><img border="0" class="center" src="../img/class-diag-IFormSubmittingComponent.png"></img><p class="paragraph"/>At the beginning of this chapter we have seen that form processing is started by process method which takes as input an instance of IFormSubmitter. This parameter corresponds to the IFormSubmittingComponent clicked by a user to submit the form and it is null if we have used a standard HTML submit button (like we have done so far).<p class="paragraph"/>A submitting component is added to a form just like any other child component using method add(Component...).<p class="paragraph"/>A form can have any number of submitting components and we can specify which one among them is the default one by calling the Form's method setDefaultB
utton(IFormSubmittingComponent  component). The default submitter is the one that will be used when user presses 'Enter' key in a field of the form. In order to make the default button work, Wicket will add to our form a hidden <div> tag containing a text field and a submit button with some JavaScript code to trigger it:<p class="paragraph"/><div class="code"><pre><div style=<span class="java-quote">"width:0px;height:0px;position:absolute;left:-100px;top:-100px;overflow:hidden"</span>>
<input type=<span class="java-quote">"text"</span> autocomplete=<span class="java-quote">"off"</span>/>
<input type=<span class="java-quote">"submit"</span> name=<span class="java-quote">"submit2"</span> onclick=<span class="java-quote">" <span class="java-keyword">var</span> b=document...."</span>/>
@@ -389,7 +392,7 @@ Starting with Wicket version 6.0 interfa
}</pre></div><p class="paragraph"/><h3>Disabling default form processing</h3><p class="paragraph"/>With an IFormSubmittingComponent we can choose to skip the default form submission process by setting the appropriate flag to false with the setDefaultFormProcessing method. When the default form processing is disabled only the submitter's onSubmit is called while form's validation and models updating are skipped.<p class="paragraph"/>This can be useful if we want to implement a âCancelâ button on our form which redirects user to another page without validating his/her input.<p class="paragraph"/>When we set this flag to false we can decide to manually invoke the form processing by calling the process(IFormSubmittingComponent) method.
-<h2 id="chapter11_5">11.5 Nested forms</h2>
+<h2 id="chapter11_5">12.5 Nested forms</h2>
<p class="paragraph"/>As you might already known, HTLM doesn't allow to have nested forms1. However with Wicket we can overcome this limitation by adding one or more form components to a parent form.<p class="paragraph"/>This can be useful if we want to split a big form into smaller ones in order to reuse them and to better distribute responsibilities among different components.
Forms can be nested to an arbitrary level:<p class="paragraph"/><div class="code"><pre><form wicket:id=<span class="java-quote">"outerForm"</span>>
…
@@ -402,11 +405,11 @@ Forms can be nested to an arbitrary leve
</form></pre></div><p class="paragraph"/>When a form is submitted also its nested forms are submitted and they participate in the validation step. This means that if a nested form contains invalid input values, the outer form won't be submitted. On the contrary, nested forms can be singularly submitted without depending on the status of their outer form.<p class="paragraph"/>To submit a parent form when one of its children forms is submitted, we must override its method wantSubmitOnNestedFormSubmit and make it return true.
-<h2 id="chapter11_6">11.6 Multi-line text input</h2>
+<h2 id="chapter11_6">12.6 Multi-line text input</h2>
<p class="paragraph"/>HTML provides a multi-line text input control with <textarea> tag. The Wicket counterpart for this kind of control is org.apache.wicket.markup.html.form.TextArea component:<p class="paragraph"/><strong class="bold">HTML:</strong><p class="paragraph"/><div class="code"><pre><textarea wicket:id=<span class="java-quote">"description"</span> rows=<span class="java-quote">"5"</span> cols=<span class="java-quote">"40"</span>></textarea></pre></div><p class="paragraph"/><strong class="bold">Java code:</strong><p class="paragraph"/><div class="code"><pre>form.add(<span class="java-keyword">new</span> TextArea(<span class="java-quote">"description"</span>, Model.of(<span class="java-quote">""</span>)));</pre></div><p class="paragraph"/>Component TextArea is used just like any other single-line text field. To specify the size of the text area we can write attributes rows and cols directly in the markup file or we can create
new attribute modifiers and add them to our TextArea component.
-<h2 id="chapter11_7">11.7 File upload</h2>
+<h2 id="chapter11_7">12.7 File upload</h2>
<p class="paragraph"/>Wicket supports file uploading with the FileUploadField component which must be used with the <input> tag whose type attribute must be set to "file". In order to send a file on form submission we must enable multipart mode calling MultiPart(true)on our form.<p class="paragraph"/>In the next example (project UploadSingleFile) we will see a form which allows users to upload a file into the temporary directory of the server (path /tmp on Unix/Linux systems):<p class="paragraph"/><strong class="bold">HTML:</strong><p class="paragraph"/><div class="code"><pre><html>
<head>
</head>
@@ -447,7 +450,7 @@ The maximum size for uploaded files can
</blockquote><p class="paragraph"/><h3>Upload multiple files</h3><p class="paragraph"/>If we need to upload multiple files at once, we can use the MultiFileUploadField component which allows the user to select an arbitrary number of files to send on form submission.<p class="paragraph"/>An example showing how to use this component can be found in Wicket module wicket-examples in file MultiUploadPage.java. The live example is hosted at <a href="http://www.wicket-library.com/wicket-examples-6.0.x/upload/multi" target="blank">http://www.wicket-library.com/wicket-examples-6.0.x/upload/multi</a> .
-<h2 id="chapter11_8">11.8 Creating complex form components with FormComponentPanel</h2>
+<h2 id="chapter11_8">12.8 Creating complex form components with FormComponentPanel</h2>
<p class="paragraph"/>In chapter 3.2.2 we have seen how to use class Panel to create custom components with their own markup and with an arbitrary number of children components.<p class="paragraph"/>While it's perfectly legal to use Panel also to group form components, the resulting component won't be itself a form component and it won't participate in the form's submission workflow.<p class="paragraph"/>This could be a strong limitation if the custom component needs to coordinate its children during sub-tasks like input conversion or model updating. That's why in Wicket we have the org.apache. wicket.markup.html.form.FormComponentPanel component which combines the features of a Panel (it has its own markup file) and a FormComponent (it is a subclass of FormComponent).<p class="paragraph"/>A typical scenario in which we may need to implement a custom FormComponentPanel is when our web application and its users work with different units of measurement for the same data.<p class="para
graph"/>To illustrate this possible scenario, let's consider a form where a user can insert a temperature that will be recorded after being converted to Kelvin degrees (see the example project CustomForm ComponentPanel).<p class="paragraph"/>The Kelvin scale is wildly adopted among the scientific community and it is one of the seven base units of the <a href="http://en.wikipedia.org/wiki/International_System_of_Units" target="blank">International System of Units</a> , so it makes perfect sense to store temperatures expressed with this unit of measurement.<p class="paragraph"/>However, in our everyday life we still use other temperature scales like Celsius or Fahrenheit, so it would be nice to have a component which internally works with Kelvin degrees and automatically applies conversion between Kelvin temperature scale and the one adopted by the user.<p class="paragraph"/>In order to implement such a component, we can make a subclass of FormComponentPanel and leverage the convertI
nput and onBeforeRender methods: in the implementation of the convertInput method we will convert input value to Kelvin degrees while in the implementation of onBeforeRender method we will take care of converting the Kelvin value to the temperature scale adopted by the user.<p class="paragraph"/>Our custom component will contain two children components: a text field to let user insert and edit a temperature value and a label to display the letter corresponding to user's temperature scale (F for Fahrenheit and C for Celsius). The resulting markup file is the following:<p class="paragraph"/><div class="code"><pre><html>
<head>
</head>
@@ -500,7 +503,7 @@ The maximum size for uploaded files can
}</pre></div><p class="paragraph"/>Since our component does not directly receive the user input, convertInput() must read this value from the inner text field using FormComponent's getConvertedInput() method which returns the input value already converted to the type specified for the component (Double in our case). Once we have the user input we convert it to kelvin degrees and we use the resulting value to set the converted input for our custom component (using method setConvertedInput(T convertedInput)).<p class="paragraph"/>Method onBeforeRender() is responsible for synchronizing the model of the inner textfield with the model of our custom component. To do this we retrieve the model object of the custom component with the getDefaultModelObject() method, then we convert it to the temperature scale adopted by the user and finally we use this value to set the model object of the text field.
-<h2 id="chapter11_9">11.9 Stateless form</h2>
+<h2 id="chapter11_9">12.9 Stateless form</h2>
<p class="paragraph"/>In chapter 6 we have seen how Wicket pages can be divided into two categories: stateful and stateless. Pages that are stateless don't need to be stored in the user session and they should be used when we don't need to save any user data in the user session (for example in the public area of a site).<p class="paragraph"/>Besides saving resources on server-side, stateless pages can be adopted to improve user experience and to avoid security weaknesses. A typical situation where a stateless page can bring these benefits is when we have to implement a login page.<p class="paragraph"/>For this kind of page we might encounter two potential problems if we chose to use a stateful page. The first problem occurs when the user tries to login without a valid session assigned to him. This could happen if the user leaves the login page opened for a period of time bigger than the session's timeout and then he decides to log in. Under these conditions the user will be redirec
ted to a 'Page expired' error page, which is not exactly a nice thing for user experience.<p class="paragraph"/>The second problem occurs when a malicious user or a web crawler program attempts to login into our web application, generating a huge number of page versions and consequently increasing the size of the user session.<p class="paragraph"/>To avoid these kinds of problems we should build a stateless login page which does not depend on a user session. Wicket provides a special version of the Form component called StatelessForm which is stateless by default (i.e its method getStatelessHint() returns true), hence it's an ideal solution when we want to build a stateless page with a form. A possible implementation of our login form is the following (example project StatelessLoginForm):<p class="paragraph"/><strong class="bold">HTML:</strong><p class="paragraph"/><div class="code"><pre><html>
<head>
<meta charset=<span class="java-quote">"utf-8"</span> />
@@ -545,7 +548,7 @@ The maximum size for uploaded files can
}</pre></div><p class="paragraph"/>Label sessionType shows if current session is temporary or not and is set inside onBeforeRender(): if our page is really stateless the session will be always temporary. We have also inserted a feedback panel in the home page that shows if the credentials are correct. This was done to make the example form more interactive.
-<h2 id="chapter11_10">11.10 Working with radio buttons and checkboxes</h2>
+<h2 id="chapter11_10">12.10 Working with radio buttons and checkboxes</h2>
<p class="paragraph"/>In this paragraph we will see which components can be used to handle HTML radio buttons and checkboxes. Both these input elements are usually grouped together to display a list of possible choices:<p class="paragraph"/><img border="0" class="center" src="../img/choice-form-screenshot.png"></img><p class="paragraph"/>A check box can be used as single component to set a boolean property. For this purpose Wicket provides the org.apache.wicket.markup.html.form.CheckBox component which must be attached to <input type="checkbox".../> tag. In the next example (project SingleCheckBox) we will consider a form similar to the one used in paragraph 9.5 to edit a Person object, but with an additional checkbox to let the user decide if she wants to subscribe to our mailing list or not. The form uses the following bean as backing object:<p class="paragraph"/><div class="code"><pre><span class="java-keyword">public</span> class RegistrationInfo <span class="java
5;keyword">implements</span> Serializable {<p class="paragraph"/> <span class="java-keyword">private</span> <span class="java-object">String</span> name;
<span class="java-keyword">private</span> <span class="java-object">String</span> surname;
<span class="java-keyword">private</span> <span class="java-object">String</span> address;
@@ -615,7 +618,7 @@ CheckBoxSelector cbmcs = <span class="ja
form.add(<span class="java-keyword">new</span> RadioChoice(<span class="java-quote">"radioGroup"</span>, Model.of(<span class="java-quote">""</span>), fruits));</pre></div><p class="paragraph"/><strong class="bold">Screenshot:</strong><p class="paragraph"/><img border="0" class="center" src="../img/grouped-radiobutton.png"></img><p class="paragraph"/>Just like CheckBoxMultipleChoice, this component provides the setPrefix and setSuffix methods to configure the prefix and suffix for our options and it supports IChoiceRender as well. In addition, RadioChoice provides the wantOnSelectionChangedNotifications() method to notify the web server when the selected option changes (this is the same method seen for DropDownChoice in paragraph 9.4).
-<h2 id="chapter11_11">11.11 Selecting multiple values with ListMultipleChoices and Palette</h2>
+<h2 id="chapter11_11">12.11 Selecting multiple values with ListMultipleChoices and Palette</h2>
<p class="paragraph"/>Checkboxes work well when we have a small amount of options to display, but they quickly become chaotic as the number of options increases. To overcome this limit we can use the <select> tag switching it to multiple-choice mode with attribute multiple="multiple":<p class="paragraph"/><img border="0" class="center" src="../img/list-multiple-choices.png"></img><p class="paragraph"/>Now the user can select multiple options by holding down Ctrl key (or Command key for Mac) and selecting them.<p class="paragraph"/>To work with multiple choice list Wicket provides the org.apache.wicket.markup.html.form. ListMultipleChoice component:<p class="paragraph"/><strong class="bold">HTML:</strong><p class="paragraph"/><div class="code"><pre><select wicket:id=<span class="java-quote">"fruits"</span>>
<option>choice 1</option>
<option>choice 2</option>
@@ -658,7 +661,7 @@ ChoiceRenderer render = <span class="jav
</table></pre></div>
-<h2 id="chapter11_12">11.12 Summary</h2>
+<h2 id="chapter11_12">12.12 Summary</h2>
Forms are the standard solution to let users interact with our web applications. In this chapter we have seen the three steps involved with the form processing workflow in Wicket. We have started looking at form validation and feedback messages generation, then we have seen how Wicket converts input values into Java objects and vice versa.<p class="paragraph"/>In the second part of the chapter we learnt how to build reusable form components and how to implement a stateless form. We have ended the chapter with an overview of the built-in form components needed to handle standard input form elements like checkboxes, radio buttons and multiple selections lists.<p class="paragraph"/>
@@ -666,9 +669,9 @@ Forms are the standard solution to let u
<div style="clear:both;margin-top:15px;"></div>
- <div class="toc-item prev-left"><a href="../guide/chapter10.html"><< <strong>10</strong><span>Wicket models and forms</span></a></div>
+ <div class="toc-item prev-left"><a href="../guide/chapter10.html"><< <strong>11</strong><span>Wicket models and forms</span></a></div>
- <div class="toc-item next-right"><a href="../guide/chapter12.html"><strong>12</strong><span>Displaying multiple items with repeaters</span> >></a></div>
+ <div class="toc-item next-right"><a href="../guide/chapter12.html"><strong>13</strong><span>Displaying multiple items with repeaters</span> >></a></div>
<div style="clear:both"></div>
</div>
Modified: wicket/common/site/trunk/_site/guide/guide/chapter12.html
URL: http://svn.apache.org/viewvc/wicket/common/site/trunk/_site/guide/guide/chapter12.html?rev=1540864&r1=1540863&r2=1540864&view=diff
==============================================================================
--- wicket/common/site/trunk/_site/guide/guide/chapter12.html (original)
+++ wicket/common/site/trunk/_site/guide/guide/chapter12.html Mon Nov 11 22:13:12 2013
@@ -2,7 +2,7 @@
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
- <title>12 Displaying multiple items with repeaters 6.x</title>
+ <title>13 Displaying multiple items with repeaters 6.x</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" href="../css/main.css" type="text/css" media="screen, print" title="Style" charset="utf-8"/>
<link rel="stylesheet" href="../css/pdf.css" type="text/css" media="print" title="PDF" charset="utf-8"/>
@@ -27,79 +27,82 @@ function addJsClass() {
<div class="toc-item" style="margin-left:0"><a href="../guide/chapter1.html"><strong>1</strong><span>Introduction</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter2.html"><strong>2</strong><span>Why should I learn Wicket?</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/howToSource.html"><strong>2</strong><span>How to use the example code</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter3.html"><strong>3</strong><span>Wicket says “Hello world!”</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter2.html"><strong>3</strong><span>Why should I learn Wicket?</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter4.html"><strong>4</strong><span>Wicket as page layout manager</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter3.html"><strong>4</strong><span>Wicket says “Hello world!”</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter5.html"><strong>5</strong><span>Keeping control over HTML</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter4.html"><strong>5</strong><span>Wicket as page layout manager</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter6.html"><strong>6</strong><span>Components lifecycle</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter5.html"><strong>6</strong><span>Keeping control over HTML</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter7.html"><strong>7</strong><span>Page versioning and caching</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter6.html"><strong>7</strong><span>Components lifecycle</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter8.html"><strong>8</strong><span>Under the hood of the request processing</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter7.html"><strong>8</strong><span>Page versioning and caching</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter9.html"><strong>9</strong><span>Wicket Links and URL generation</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter8.html"><strong>9</strong><span>Under the hood of the request processing</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter10.html"><strong>10</strong><span>Wicket models and forms</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter9.html"><strong>10</strong><span>Wicket Links and URL generation</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter11.html"><strong>11</strong><span>Wicket forms in detail</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter10.html"><strong>11</strong><span>Wicket models and forms</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter12.html"><strong>12</strong><span>Displaying multiple items with repeaters</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter11.html"><strong>12</strong><span>Wicket forms in detail</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter13.html"><strong>13</strong><span>Internationalization with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter12.html"><strong>13</strong><span>Displaying multiple items with repeaters</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter14.html"><strong>14</strong><span>Resource management with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter13.html"><strong>14</strong><span>Internationalization with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter15.html"><strong>15</strong><span>An example of integration with JavaScript</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter14.html"><strong>15</strong><span>Resource management with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter16.html"><strong>16</strong><span>Wicket advanced topics</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter15.html"><strong>16</strong><span>An example of integration with JavaScript</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter17.html"><strong>17</strong><span>Working with AJAX</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter16.html"><strong>17</strong><span>Wicket advanced topics</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter18.html"><strong>18</strong><span>Integration with enterprise containers</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter17.html"><strong>18</strong><span>Working with AJAX</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter19.html"><strong>19</strong><span>Security with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter18.html"><strong>19</strong><span>Integration with enterprise containers</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter20.html"><strong>20</strong><span>Test Driven Development with Wicket</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter19.html"><strong>20</strong><span>Security with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter21.html"><strong>21</strong><span>Test Driven Development with Wicket and Spring</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter20.html"><strong>21</strong><span>Test Driven Development with Wicket</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter22.html"><strong>22</strong><span>Wicket Best Practices</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter21.html"><strong>22</strong><span>Test Driven Development with Wicket and Spring</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter23.html"><strong>23</strong><span>Working with Maven (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter22.html"><strong>23</strong><span>Wicket Best Practices</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter24.html"><strong>24</strong><span>Project WicketStuff (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter23.html"><strong>24</strong><span>Working with Maven (Appendix)</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter25.html"><strong>25</strong><span>Lost In Redirection With Apache Wicket (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter24.html"><strong>25</strong><span>Project WicketStuff (Appendix)</span></a>
</div>
- <div class="toc-item" style="margin-left:0"><a href="../guide/chapter26.html"><strong>26</strong><span>Contributing to this guide (Appendix)</span></a>
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter25.html"><strong>26</strong><span>Lost In Redirection With Apache Wicket (Appendix)</span></a>
+ </div>
+
+ <div class="toc-item" style="margin-left:0"><a href="../guide/chapter26.html"><strong>27</strong><span>Contributing to this guide (Appendix)</span></a>
</div>
</div>
@@ -129,18 +132,18 @@ function addJsClass() {
<div id="main" class="corner-all">
- <div class="toc-item prev-left"><a href="../guide/chapter11.html"><< <strong>11</strong><span>Wicket forms in detail</span></a></div>
+ <div class="toc-item prev-left"><a href="../guide/chapter11.html"><< <strong>12</strong><span>Wicket forms in detail</span></a></div>
<span id='toggle-col1' class="toggle">(<a href="#" onclick="localToggle(); return false;">Quick Reference</a>)</span>
- <div class="toc-item next-right"><a href="../guide/chapter13.html"><strong>13</strong><span>Internationalization with Wicket</span> >></a></div>
+ <div class="toc-item next-right"><a href="../guide/chapter13.html"><strong>14</strong><span>Internationalization with Wicket</span> >></a></div>
<div class="project">
- <h1>12 Displaying multiple items with repeaters - Reference Documentation</h1>
+ <h1>13 Displaying multiple items with repeaters - Reference Documentation</h1>
<p><strong>Authors:</strong> Andrea Del Bene, Carsten Hufe, Christian Kroemer, Daniel Bartl, Paul BorÈ</p>
@@ -153,19 +156,19 @@ function addJsClass() {
<div id="table-of-content">
<h2>Table of Contents</h2>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter12_1"><strong>12.1</strong><span>Component RepeatingView</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter12_1"><strong>13.1</strong><span>Component RepeatingView</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter12_2"><strong>12.2</strong><span>Component ListView</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter12_2"><strong>13.2</strong><span>Component ListView</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter12_3"><strong>12.3</strong><span>Component RefreshingView</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter12_3"><strong>13.3</strong><span>Component RefreshingView</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter12_4"><strong>12.4</strong><span>Pageable repeaters</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter12_4"><strong>13.4</strong><span>Pageable repeaters</span></a>
</div>
- <div class="toc-item" style="margin-left:0px"><a href="#chapter12_5"><strong>12.5</strong><span>Summary</span></a>
+ <div class="toc-item" style="margin-left:0px"><a href="#chapter12_5"><strong>13.5</strong><span>Summary</span></a>
</div>
</div>
@@ -173,7 +176,7 @@ function addJsClass() {
-<h1 id="chapter12">12 Displaying multiple items with repeaters</h1>
+<h1 id="chapter12">13 Displaying multiple items with repeaters</h1>
A common task for web applications is to display a set of items. The most typical scenario where we need such kind of visualization is when we have to display some kind of search result. With the old template-based technologies (like JSP) we used to accomplish this task using classic for or while loops:<p class="paragraph"/><div class="code"><pre><html>
<head>
<meta http-equiv=<span class="java-quote">"Content-Type"</span> content=<span class="java-quote">"text/html; charset=UTF-8"</span>>
@@ -190,7 +193,7 @@ A common task for web applications is to
</body></pre></div><p class="paragraph"/>To ease this task Wicket provides a number of special-purpose components called repeaters which are designed to use their related markup to display the items of a given set in a more natural and less chaotic way.<p class="paragraph"/>In this chapter we will see some of the built-in repeaters that come with Wicket.
-<h2 id="chapter12_1">12.1 Component RepeatingView</h2>
+<h2 id="chapter12_1">13.1 Component RepeatingView</h2>
<p class="paragraph"/>Component org.apache.wicket.markup.repeater.RepeatingView is a container which renders its children components using the tag it is bound to. It can contain an arbitrary number of children elements and we can obtain a new valid id for a new child calling its method newChildId(). This component is particularly suited when we have to repeat a simple markup fragment, for example when we want to display some items as a HTML list:<p class="paragraph"/><strong class="bold">HTML:</strong>
<div class="code"><pre><ul>
<li wicket:id=<span class="java-quote">"listItems"</span>></li>
@@ -205,7 +208,7 @@ listItems.add(<span class="java-keyw
</ul></pre></div><p class="paragraph"/>As we can see in this example, each child component has been rendered using the parent markup as if it was its own.
-<h2 id="chapter12_2">12.2 Component ListView</h2>
+<h2 id="chapter12_2">13.2 Component ListView</h2>
<p class="paragraph"/>As its name suggests, component org.apache.wicket.markup.html.list.ListView is designed to display a given list of objects which can be provided as a standard Java List or as a model containing the concrete List. ListView iterates over the list and creates a child component of class org.apache.wicket.markup.html.list.ListItem for every encountered item.<p class="paragraph"/>Unlike RepeatingView this component is intended to be used with complex markup fragments containing nested components.<p class="paragraph"/>To generate its children, ListView calls its abstract method populateItem(ListItem<T> item) for each item in the list, so we must provide an implementation of this method to tell the component how to create its children components. In the following example we use a ListView to display a list of Person objects:<p class="paragraph"/><strong class="bold">HTML:</strong>
<div class="code"><pre>…
<body>
@@ -228,7 +231,7 @@ listItems.add(<span class="java-keyw
}</pre></div><p class="paragraph"/><strong class="bold">Screenshot of generated page:</strong><p class="paragraph"/><img border="0" class="center" src="../img/simple-listview-screenshot.png"></img><p class="paragraph"/>In this example we have displayed the full name of two Person's instances. The most interesting part of the code is the implementation of method populateItem where parameter item is the current child component created by ListView and its model contains the corresponding element of the list. Please note that inside populateItem we must add nested components to item object and not directly to the ListView.<p class="paragraph"/><h3>ListView and Form</h3><p class="paragraph"/>By default ListView replaces its children components with new instances every time is rendered. Unfortunately this behavior is a problem if ListView is inside a form and it contains form components. The problem is caused by the fact that children components are replaced by new ones before form i
s rendered, hence they can't keep their input value if validation fails and, furthermore, their feedback messages can not be displayed.<p class="paragraph"/>To avoid this kind of problem we can force ListView to reuse its children components using its method setReuseItems and passing true as parameter. If for any reason we need to refresh children components after we have invoked setReuseItems(true), we can use MarkupContainer's method removeAll() to force ListView to rebuild them.
-<h2 id="chapter12_3">12.3 Component RefreshingView</h2>
+<h2 id="chapter12_3">13.3 Component RefreshingView</h2>
<p class="paragraph"/>Component org.apache.wicket.markup.repeater.RefreshingView is a subclass of RepeatingView that comes with a customizable rendering strategy for its children components.<p class="paragraph"/>RefreshingView defines abstract methods populateItem(Item) and getItemModels(). The first method is similar to the namesake method seen for ListView, but it takes in input an instance of class org.apache.wicket.markup.repeater.Item which is a subclass of ListItem. RefreshingView is designed to display a collection of models containing the actual items. An iterator over these models is returned by the other abstract method getItemModels.<p class="paragraph"/>The following code is a version of the previous example that uses RefreshingView in place of ListView:<p class="paragraph"/><strong class="bold">HTML:</strong>
<div class="code"><pre>…
<body>
@@ -255,7 +258,7 @@ listItems.add(<span class="java-keyw
}</pre></div><p class="paragraph"/><h3>Item reuse strategy</h3><p class="paragraph"/>By default, just like ListView, RefreshingView replaces its children with new instances every time is rendered. The strategy that decides if and how children components must be refreshed is returned by method getItemReuseStrategy. This strategy is an implementation of interface IItemReuseStrategy. The default implementation used by RefreshingView is class DefaultItemReuseStrategy but Wicket provides also strategy ReuseIfModelsEqualStrategy which reuses an item if its model has been returned by the iterator obtained with method getItemModels.<p class="paragraph"/>To set a custom strategy we must use method setItemReuseStrategy.
-<h2 id="chapter12_4">12.4 Pageable repeaters</h2>
+<h2 id="chapter12_4">13.4 Pageable repeaters</h2>
<p class="paragraph"/>Wicket offers a number of components that should be used when we have to display a big number of items (for example the results of a select SQL query).<p class="paragraph"/>All these components implements interface org.apache.wicket.markup.html.navigation. paging.IPageable and use interface IDataProvider (placed in package org.apache.wicket. markup.repeater.data) as data source. This interface is designed to support data paging. We will see an example of data paging later in paragraph 11.4.2.<p class="paragraph"/>The methods defined by IDataProvider are the following:
<ul class="star">
<li>iterator(long first, long count): returns an iterator over a subset of the entire dataset. The subset starts from the item at position first and includes all the next count items (i.e. it's the closed interval first,first+count).</li>
@@ -312,15 +315,15 @@ Wicket provides also component PageableL
</blockquote>
-<h2 id="chapter12_5">12.5 Summary</h2>
+<h2 id="chapter12_5">13.5 Summary</h2>
<p class="paragraph"/>In this chapter we have explored the built-in set of components called repeaters which are designed to repeat their own markup in output to display a set of items. We have started with component RepeatingView which can be used to repeat a simple markup fragment.<p class="paragraph"/>Then, we have seen components ListView and RefreshingView which should be used when the markup to repeat contains nested components to populate.<p class="paragraph"/>Finally, we have discussed those repeaters that support data paging and that are called pageable repeaters. We ended the chapter looking at an example where a pageable repeater is used with panel PagingNavigator to make its dataset navigable by the user.
<div style="clear:both;margin-top:15px;"></div>
- <div class="toc-item prev-left"><a href="../guide/chapter11.html"><< <strong>11</strong><span>Wicket forms in detail</span></a></div>
+ <div class="toc-item prev-left"><a href="../guide/chapter11.html"><< <strong>12</strong><span>Wicket forms in detail</span></a></div>
- <div class="toc-item next-right"><a href="../guide/chapter13.html"><strong>13</strong><span>Internationalization with Wicket</span> >></a></div>
+ <div class="toc-item next-right"><a href="../guide/chapter13.html"><strong>14</strong><span>Internationalization with Wicket</span> >></a></div>
<div style="clear:both"></div>
</div>