Question

当从AutoCompleteTextField中选择一个选项时，我正在使用AjaxFormComponentUpdatingBehavior来做一些事情。完成这些工作之后，我想要清除该字段，但它的行为并不像我预期的那样。

以下是相关的代码：

final AutoCompleteTextField<String> searchField =
    new AutoCompleteTextField<String>(id, model);

searchField.add(new AjaxFormComponentUpdatingBehavior("onchange") 
{           
    @Override
    protected void onUpdate(AjaxRequestTarget target) 
    {
        // Do stuff with the selected value here
        ...
        searchField.clearInput();
        target.addComponent(searchField);

    }                                               
});

我将值放在ListView中并将其添加到目标中。它会正确更新，但AutoCompleteTextField不会。

Answer 1

我认为您的示例不起作用，因为您使用服务器端的模型在客户端重新渲染组件。如果您重置模型值并重新绘制它必须工作的组件。

        searchField.setModelObject(null);
        target.addComponent(searchField);

然而，渲染整个组件并不是必需的，只需清除服务器和客户端上的值即可。

以下示例清除模型对象并通过javascript（jQuery）重置字段值。

final AutoCompleteTextField<String> searchField =
    new AutoCompleteTextField<String>(id, model);
searchField.setOutputMarkupId(true);
searchField.add(new AjaxFormComponentUpdatingBehavior("onchange") 
{           
    @Override
    protected void onUpdate(AjaxRequestTarget target) 
    {
        // Do stuff with the selected value here
        ...
        searchField.clearInput();
        searchField.setModelObject(null);
        target.appendJavascript("$('#" + searchField.getMarkupId() + "').val('');");

    }                                               
});

如果你在6.x之前使用Wicket，则不包括jQuery。您可以使用以下JS：

        target.appendJavascript("document.getElementById('" + searchField.getMarkupId() + "').value = '';");

选择选项后，如何清除检票口AutoCompleteTextField？

1 个答案: