Как очистить калитку AutoCompleteTextField после выбора?

Question

Я использую AjaxFormComponentUpdatingBehavior, чтобы сделать некоторые вещи, когда выбор выбран из AutoCompleteTextField. После этого дела я хочу очистить поле, но он не ведет себя так, как я ожидал.

Here're соответствующие биты кода:

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('');"); 

    }            
}); 

Если вы используете Wicket до 6.x, тогда jQuery не включен. Вы можете использовать следующие JS:

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