Пример Wicket Palette

Пример палитры калитки

Расширение Wicket поставляется со специальным компонентом «Palette», который отображает два поля выбора и позволяет пользователю перемещать элементы из одного поля выбора в другое.

Рис.: Компонент палитры

wicket palette

//Java
import org.apache.wicket.extensions.markup.html.form.palette.Palette;

final Palette palette = new Palette("palette",
    new ListModel(selected),
    new CollectionModel(listHosting),
    renderer, 10, true);


//HTML

Подпись палитры

Palette(String id,
    IModel> model,
    IModel> choicesModel,
    IChoiceRenderer choiceRenderer,
    int rows, boolean allowOrder)

id - идентификатор компонента
модель Модель - представляет коллекцию пользовательских выборов
Модель choicesModel - представляет коллекцию всех доступных вариантов
choiceRenderer - Render используется для визуализации выбора. Это должно использовать уникальные идентификаторы для объектов, а не индекс
rows - количество вариантов, отображаемых на экране без прокрутки
allowOrder - позволяет пользователю перемещать выборки вверх и вниз

Note
Довольно сложно понять, правда? Не берите в голову, прочитайте следующий полный пример Wicket Palette.

1. Расширение калитки

Чтобы использовать «Palette», вам понадобится jar «wicket-extensions».

Файл: pom.xml



    

        
            org.apache.wicket
            wicket-extensions
            1.4.17

2. Модель для палитры

Создайте класс модели, чтобы представить варианты выбора в поле выбора.

package com.example.user;

import java.io.Serializable;

public class Hosting implements Serializable {

    String id;
    String name;

    //getter, setter, constructor and toString() methods

}

3. Пример палитры

Пример размещения указанной выше модели хостинга в компоненте Palette и использованияChoiceRenderer, чтобы решить, что отображать. Это должно быть само за себя.

package com.example.user;

import java.util.ArrayList;
import java.util.List;
import org.apache.wicket.PageParameters;
import org.apache.wicket.extensions.markup.html.form.palette.Palette;
import org.apache.wicket.markup.html.form.ChoiceRenderer;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.form.IChoiceRenderer;
import org.apache.wicket.markup.html.panel.FeedbackPanel;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.model.util.CollectionModel;
import org.apache.wicket.model.util.ListModel;

public class PalettePage extends WebPage {

    private static final List listHosting;
    static
    {
        listHosting = new ArrayList();
        listHosting.add(new Hosting("1", "Shared"));
        listHosting.add(new Hosting("2", "VPS"));
        listHosting.add(new Hosting("3", "Dedicated"));
    }

    private List selected = new ArrayList();


    public PalettePage(final PageParameters parameters) {

        add(new FeedbackPanel("feedback"));

        Form form = new Form("form") {
            @Override
            protected void onSubmit() {

                info("Selected language : " + selected);

            }
        };

        add(form);

        //make VPS selected by default
        //selected.add(new Hosting("2", "VPS"));

        IChoiceRenderer renderer = new ChoiceRenderer("name","id");

        final Palette palette = new Palette("palette",
                new ListModel(selected),
                new CollectionModel(listHosting),
                renderer, 10, true);

        form.add(palette);

    }
}

How to make certain value selected by default.
В этом случае, чтобы сделать «VPS» выбранным по умолчанию, добавьте это в переменную «selected»:

 selected.add(new Hosting("2", "VPS"));

4. HTML-страница

Полный исходный код HTML.






    Wicket palette example

    
    
        
            Select your hosting types

5. Demo

Начало и посещение -http://localhost:8080/WicketExamples/

Выберите и переместите некоторые элементы, а затем нажмите кнопку дисплея.

wicket palette

P.S The sort up and sort down buttons are applied to selected item (right select box) only.

Скачать -Wicket-Palette-Example.zip (8KB)

TOC