Reset значение null в событии автозаполнения

89
5

У меня есть событие автозаполнения, которое срабатывает корректно после выбора значения. Я хочу, чтобы другое событие срабатывало, когда я стираю значение в текстовом поле и reset значение null. Я думал об использовании атрибута onChange, но у меня были проблемы, поэтому я вернулся к исходному коду.


<p:autoComplete id="deviceAuto" dropdown="true" scrollHeight="250" 
value="#{summaryReportController.device.nickname}"
forceSelection="true"
completeMethod="#{summaryReportController.deviceComplete}">
<p:ajax event="itemSelect"
listener="#{summaryReportController.handleDeviceSelect}"
update="printThis" />
</p:autoComplete>

public void handleDeviceSelect(SelectEvent event) {
String deviceSelect = event.getComponent().getId();
if (deviceSelect.equalsIgnoreCase("deviceAuto")) {
Device selectedDevice = deviceMgr.getDevicebyNickname(device.getNickname());
setDevice(selectedDevice);
}
updateInterface();
}

спросил(а) 2021-01-19T15:08:01+03:00 6 месяцев, 1 неделя назад
1
Решение
78

При изменении текстового содержимого текстового поля автозаполнения на основе bean вызывается метод поиска (далее метод completeMethod). Вы можете reset значение null там, если вы получите пустую строку.


Поддержка Bean


// insert getter and setter for the device property ...

/** Search for devices by name */
public List<String> deviceComplete(String search) {
if (StringUtils.isBlank(search)) {
setDevice(null); // textfield was cleared, reset device value!
return Collections.emptyList();
} else {
// search for devices ...
return deviceNames;
}
}


Обратите внимание, что я использовал Apache Commons StringUtils.isBlank(String) проверить, была ли строка нулевой или содержать только пробельные символы.


Просмотр JSF

В вашем файле XHTML вы, вероятно, захотите прослушать любое событие Ajax для обновления своего представления - или вы сами выясните, какое событие вам нужно (размытие, изменение, что угодно):


<p:autoComplete ...>
<p:ajax event="itemSelect" listener="..." update="..." />
<p:ajax process="@this" update="..." />
</p:autocomplete>

Надеюсь, это поможет.


Альтернативой может быть что-то вроде кнопки "clear" или "reset" рядом с текстовым полем поиска, чтобы пользователь дал понять, что значение будет очищено.

ответил(а) 2021-01-19T15:08:01+03:00 6 месяцев, 1 неделя назад
77

Атрибут autoComplete по умолчанию minQueryLength по умолчанию равен 1, и ваша строка поиска будет обновлена ​​при удалении, пока она не будет иметь длину 1 символ.


т.д.:
Вы вводите "foo" - и эта строка предоставляется методу поиска (обновление после ввода первого символа - minQueryLength = 1)


Но когда вы удаляете строку поиска - она ​​также обновляется до тех пор, пока она не будет иметь длину 1.


Решение:
установить атрибут minQueryLength="0"

Или:


если вам нужно большее значение, добавьте условие autoCompleteMethod(String search):


if (search.length()<={your minQueryLength attribute} )   field = null;

ответил(а) 2021-01-19T15:08:01+03:00 6 месяцев, 1 неделя назад
45

Старый вопрос, но я думаю, что это стоит другого взгляда.


Проблема с minQueryLenth = 0 или minQueryLenth = 1 заключается в том, что она может возвращать сотни опций (и, конечно, пользователь не будет читать их все, чтобы выбрать один). Мое решение было следующим.


Прежде всего, мне нужен вход для отправки на сервер, как только пользователь выберет одно из своих значений (в моем случае пользователю не разрешено перейти к следующему шагу мастера, если это значение равно null или пусто). Поэтому я помещаю функцию ajax, вызванную в случае выбранного значения.


XHTML:


<p:autoComplete
id="someId"
value="#{myViewScopedBean.selectedValue}"
...
...
minQueryLenth="5"
onblur="autoCompleteLostFocus('someId', 'someCommand()')">

<p:ajax
event="itemSelect"
listener="#{myViewScopedBean.newValueSelected}"
process="@this"
update="commandButtonGoToNextStep" />

</p:autoComplete>

<p:remoteCommand
name="someCommand"
actionListener="#{myViewScopedBean.setValueNull}"
update="commandButtonGoToNextStep" />

<p:commandButton
id="commandButtonGoToNextStep"
...
...
disabled="#{myViewScopedBean.selectedValue == null}" />


Если пользователь очищает текст, мне нужно отправить это значение в "myViewScopedBean" и обновить компонент, который позволяет пользователю перейти к следующему шагу. Я решил, что добавление функции javascript, вызываемой, когда автозаполнение потеряет фокус.


JavaScript:


function autoCompleteLostFocus(autocompleteId, comand) {

if ($("[id='" + autocompleteId + "_input']").val().trim() == "") {
eval(comando);
}

}


в myViewScopedBean:


public void setValueNull() {
selectedValue = null;
}

Надеюсь, это поможет. Много работы, но поведение именно то, что я хотел. Причиной для функции javascript является то, что она просто отправляет информацию сервлету, если значение равно "", в противном случае оно ничего не делает.

ответил(а) 2021-01-19T15:08:01+03:00 6 месяцев, 1 неделя назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема