Buy me a coffee :)

Wicket - jQuery UI

jQuery UI integration in Wicket 6.x, Wicket 7.x , Wicket 8.x & Wicket 9.x


Components / Samples


This sample shows how to use the Kendo UI Check.




Kendo UI "Core" is Apache License 2.0 licensed, starting from version 2014.1.416.
Prior to version 2014.1.416, Kendo UI "Web" was licensed under GPLv3.

A pro version - with a commercial license - is also available, it provides additional widgets (see
To be able to use it, you need to change the ResourceReference with kendo.all.min.js

See also



  • Java
  • HTML
  • CSS

import java.util.ArrayList;
import java.util.List;

import org.apache.wicket.Component;
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.markup.head.IHeaderResponse;
import org.apache.wicket.markup.html.form.CheckGroup;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.model.IModel;
import org.apache.wicket.model.Model;

import com.googlecode.wicket.jquery.core.resource.StyleSheetPackageHeaderItem;
import com.googlecode.wicket.kendo.ui.form.Check;
import com.googlecode.wicket.kendo.ui.form.Check.Label;
import com.googlecode.wicket.kendo.ui.form.button.AjaxButton;
import com.googlecode.wicket.kendo.ui.form.button.Button;
import com.googlecode.wicket.kendo.ui.panel.KendoFeedbackPanel;

public class KendoCheckPage extends AbstractRadioPage
	private static final long serialVersionUID = 1L;

	private final Form<List<String>> form;

	public KendoCheckPage()
		// form //
		this.form = new Form<List<String>>("form", Model.ofList(new ArrayList<String>()));

		// feedback //
		this.form.add(new KendoFeedbackPanel("feedback"));

		// checks //
		final CheckGroup<String> group = new CheckGroup<String>("checkgroup", form.getModel());

		Check<?> check1 = new Check<String>("check1", Model.of("My check 1"), group);
		Label label1 = new Label("label1", "My check 1", check1);
		group.add(check1, label1);

		Check<?> check2 = new Check<String>("check2", Model.of("My check 2"), group);
		Label label2 = new Label("label2", "My check 2", check2);
		group.add(check2, label2);

		Check<?> check3 = new Check<String>("check3", Model.of("My check 3"), group);
		Label label3 = new Label("label3", "My check 3", check3);
		group.add(check3.setEnabled(false), label3);

		// buttons //

	// Methods //

	public void renderHead(IHeaderResponse response)

		response.render(new StyleSheetPackageHeaderItem(KendoCheckPage.class));

	private void info(Component component, IModel<List<String>> model)
	{ + " has been clicked");"The model object is: " + model.getObject());

	// Factories //

	private Button newSubmitButton(String id)
		return new Button(id) {

			private static final long serialVersionUID = 1L;

			public void onSubmit()
			{, form.getModel());

	private AjaxButton newAjaxButton(String id)
		return new AjaxButton(id) {

			private static final long serialVersionUID = 1L;

			protected void onSubmit(AjaxRequestTarget target)
			{, form.getModel());
<!DOCTYPE html>
<html xmlns:wicket="">
	<title>Wicket Kendo UI: check</title>

	<div id="demo-panel">
		<form wicket:id="form">
			<div wicket:id="checkgroup">
				<ul class="checkUL">
						<input wicket:id="check1" type="checkbox"/>
						<label wicket:id="label1">[label]</label>
						<input wicket:id="check2" type="checkbox"/>
						<label wicket:id="label2">[label]</label>
						<input wicket:id="check3" type="checkbox"/>
						<label wicket:id="label3">[label]</label>
			<button wicket:id="submit" type="submit">Submit</button>
			<button wicket:id="button">Ajax Submit</button>
			<div wicket:id="feedback" style="width: 360px;"></div>
.checkUL {
	list-style: none;

.checkUL li {
	line-height: 25px;