gpt4 book ai didi

html - Wicket:带有用于多选的复选框的下拉框

转载 作者:搜寻专家 更新时间:2023-10-31 08:21:57 25 4
gpt4 key购买 nike

我需要在 Wicket 的下拉框中紧凑地呈现多项选择,方法是在下拉框中的每个值旁边有一个复选框。我正在考虑将 ListView 与 CheckBox 和 Label 一起用作 DropDownChoice 的组件,但我不确定如何进一步进行。

最佳答案

您可以使用一些应用于 Wicket 的 ListMultipleChoice 的 javascript 库(它生成一个 [select multiple="multiple"] HTML 标记。我发现一个( jQuery UI MultiSelect Widgethosted at GitHub )作为 jQuery 插件实现,它可以工作很好。感谢 @erichynds !

Page 类只是一个普通的 Wicket 页面,您所要做的就是导入脚本/样式表,并调用单个函数(高度可配置):

主页.java:

public class HomePage extends WebPage {

List<String> selection = new ArrayList<String>();

public HomePage() {
add(CSSPackageResource.getHeaderContribution(HomePage.class, "jquery.multiselect.css"));
add(JavascriptPackageResource.getHeaderContribution(HomePage.class, "jquery.multiselect.min.js"));

add(new FeedbackPanel("feedback"));
Form form = new Form("form") {
@Override
protected void onSubmit() {
info(selection.toString());
}
};
form.add(new ListMultipleChoice("list",
new PropertyModel(this, "selection"),
Arrays.asList("A", "B", "C", "D", "E", "F", "G", "H")));
add(form);
}
}

HomePage.html

<html xmlns:wicket="http://wicket.apache.org">
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/cupertino/jquery-ui.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("select").multiselect();
});
</script>
</head>
<body>
<div wicket:id="feedback"></div>
<form wicket:id="form">
<select wicket:id="list"></select>
<br/>
<input type="submit">
</form>
</body>
</html>

关于html - Wicket:带有用于多选的复选框的下拉框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4684936/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com