Com*_*eOn 5 java wicket wicket-6
我有检票口AutoCompleteTextField。为了更新模型,我使用“onblur”事件。我需要在“onblur”事件发生后刷新文本字段,因为需要验证。
这是说明问题的代码示例
网页子类:
public class TestPage extends WebPage {
private Integer testField;
public TestPage() {
final List<Integer> allowedValues = new ArrayList<Integer>();
for (int i = 0; i < 5; i++) {
allowedValues.add(50 + i * 5);
}
final PropertyModel<Integer> testModel = new PropertyModel<Integer>(this, "testField");
final AutoCompleteSettings autoCompleteSettings = new AutoCompleteSettings();
autoCompleteSettings.setShowListOnEmptyInput(true);
autoCompleteSettings.setShowListOnFocusGain(true);
final AutoCompleteTextField<Integer> testInput =
new AutoCompleteTextField<Integer>("testInput", testModel, autoCompleteSettings) {
@Override
protected Iterator<Integer> getChoices(final String input) {
return allowedValues.iterator();
}
};
testInput.setOutputMarkupId(true);
testInput.setMarkupId("testInput");
add(testInput);
testInput.add(new AjaxFormComponentUpdatingBehavior("onblur") {
@Override
protected void onUpdate(final AjaxRequestTarget target) {
target.add(testInput);
}
});
}
}
Run Code Online (Sandbox Code Playgroud)
对应的HTML:
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd" xml:lang="en"
lang="en">
<body>
<input type="text" wicket:id="testInput"/>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
问题是无法通过鼠标点击来选择值。
我尝试过使用OnChangeAjaxBehavior- 并且通过鼠标单击进行选择有效,但我不想在每次更改后执行验证(例如用户想要输入 54,他输入 5 => 验证开始,因为OnChangeAjaxBehavior被触发)
我尝试过使用两者的组合 AjaxFormComponentUpdatingBehavior("onblur"),并且OnChangeAjaxBehavior遇到了同样的问题:无法通过鼠标单击选择值,因为“onblur”在“onchange”之前触发
请注意,如果您注释该行target.add(testInput);,它将按预期工作。
这似乎与这个 Wicket问题类似
它说该问题已在 6.18.0 版本中修复,但我使用的是 Wicket 6.18.0,但仍然存在此问题。
我们一直在执行从 Wicket 1.4 到 wicket 6 的升级。在 Wicket 1.4 中它运行良好。
请给我有关如何解决此问题的任何建议。我们将非常感谢您的帮助。提前致谢。
我建议您使用 wicket Jquery UI 自动完成框:
\n\n网页:
\n\n<!DOCTYPE html>\n<html xmlns:wicket="http://wicket.apache.org">\n<head>\n<wicket:head>\n <title>Wicket - jQuery UI: auto-complete</title>\n <style type="text/css">\n .ui-autocomplete {\n max-height: 200px;\n overflow-y: auto;\n overflow-x: hidden;\n padding-right: 20px;\n } \n </style>\n</wicket:head>\n</head>\n<body>\n<wicket:extend>\n <div id="wrapper-panel-frame" class="ui-corner-all">\n <form wicket:id="form">\n <div>Choose your favorite rock genre: (that starts with your criteria)</div>\n <br/>\n <input wicket:id="autocomplete" type="text" size="30" title="enter your criteria here"></input><br/>\n <br/>\n <div wicket:id="feedback" style="width: 360px;"></div>\n </form>\n </div>\n</wicket:extend>\n</body>\n</html>\nRun Code Online (Sandbox Code Playgroud)\n\n爪哇
\n\npackage com.googlecode.wicket.jquery.ui.samples.pages.autocomplete;\n\nimport java.util.ArrayList;\nimport java.util.Arrays;\nimport java.util.List;\n\nimport org.apache.wicket.ajax.AjaxRequestTarget;\nimport org.apache.wicket.markup.html.form.Form;\nimport org.apache.wicket.markup.html.panel.FeedbackPanel;\nimport org.apache.wicket.model.Model;\n\nimport com.googlecode.wicket.jquery.ui.form.autocomplete.AutoCompleteTextField;\nimport com.googlecode.wicket.jquery.ui.panel.JQueryFeedbackPanel;\n\npublic class DefaultAutoCompletePage extends AbstractAutoCompletePage\n{\n private static final long serialVersionUID = 1L;\n private static final List<String> CHOICES = Arrays.asList("Acid rock", "Alternative metal", "Alternative rock", "Anarcho punk", "Art punk", "Art rock", "Beat music", "Black metal", "Blues-rock", "Britpop", "Canterbury scene",\n "Chinese rock", "Christian metal", "Crossover Thrash Metal", "Crust punk", "Crustgrind", "Dark cabaret", "Death metal", "Deathcore", "Deathrock", "Desert rock", "Djent", "Doom metal", "Dream pop", "Drone metal",\n "Dunedin Sound", "Electronic rock", "Emo", "Experimental rock", "Folk metal", "Folk rock", "Freakbeat", "Funk metal", "Garage punk", "Garage rock", "Glam metal", "Glam rock", "Goregrind", "Gothic metal", "Gothic rock",\n "Grindcore", "Groove metal", "Grunge", "Hard rock", "Hardcore punk", "Heavy metal", "Indie pop", "Indie rock", "Industrial metal", "Industrial rock", "J-Rock", "Jazz-Rock", "Krautrock", "Math rock", "Mathcore",\n "Melodic Death Metal", "Melodic metalcore", "Metalcore", "Neo-psychedelia", "New Prog", "New Wave", "No Wave", "Noise pop", "Noise rock", "Noisegrind", "Nu metal", "Paisley Underground", "Pop punk", "Pop rock", "Pornogrind",\n "Post-Britpop", "Post-grunge", "Post-hardcore", "Post-metal", "Post-punk", "Post-punk revival", "Post-rock", "Power metal", "Power pop", "Progressive metal", "Progressive rock", "Psychedelic rock", "Psychobilly", "Punk rock",\n "Raga rock", "Rap metal", "Rap rock", "Rapcore", "Riot grrrl", "Rock and roll", "Rock en Espa\xc3\xb1ol", "Rock in Opposition", "Sadcore", "Screamo", "Shoegazer", "Slowcore", "Sludge metal", "Soft rock", "Southern rock", "Space Rock",\n "Speed metal", "Stoner rock", "Sufi rock", "Surf rock", "Symphonic metal", "Technical Death Metal", "Thrash metal", "Thrashcore", "Twee Pop", "Unblack metal", "World Fusion");\n\n public DefaultAutoCompletePage()\n {\n // Form //\n final Form<Void> form = new Form<Void>("form");\n this.add(form);\n\n // FeedbackPanel //\n final FeedbackPanel feedback = new JQueryFeedbackPanel("feedback");\n form.add(feedback.setOutputMarkupId(true));\n\n // Auto-complete //\n form.add(new AutoCompleteTextField<String>("autocomplete", new Model<String>()) {\n\n private static final long serialVersionUID = 1L;\n\n @Override\n protected List<String> getChoices(String input)\n {\n List<String> choices = new ArrayList<String>();\n String inputLowerCase = input.toLowerCase();\n\n int count = 0;\n for (String choice : CHOICES)\n {\n if (choice.toLowerCase().startsWith(inputLowerCase))\n {\n choices.add(choice);\n\n // limits the number of results\n if (++count == 20)\n {\n break;\n }\n }\n }\n\n return choices;\n\n //\n // Equivalent to:\n // return ListUtils.startsWith(input, CHOICES);\n //\n }\n\n @Override\n protected void onSelected(AjaxRequestTarget target)\n {\n info("Your favorite rock genre is: " + this.getModelObject());\n target.add(feedback);\n }\n });\n }\n}\nRun Code Online (Sandbox Code Playgroud)\n\n您可以根据需要更改此组件
\n\n如果不适合,请检查以下链接:
\n\n\n