Reset null in autocomplete event
I have an autocomplete event that fires correctly after a value is selected. I want another event to fire when I erase the value in the textbox and reset the value to null. I was thinking about using the onChange attribute, but I was having problems, so I went back to the original code.
<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();
}
source to share
When the text content of the bean-based autocomplete text box changes, the search method (hereinafter the completeMethod method) is called. You can reset the value null
there if you get an empty string.
Bean support
// 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;
}
}
Please note that I used Apache Commons StringUtils.isBlank (String) to check if the string was null or only contain whitespace.
JSF View
In your XHTML file, you probably want to listen for any Ajax event to update your view - or you figure out what event you want (blur, change, whatever):
<p:autoComplete ...>
<p:ajax event="itemSelect" listener="..." update="..." />
<p:ajax process="@this" update="..." />
</p:autocomplete>
Hope this helps.
An alternative could be something like a "clear" or "reset" button next to the search text box to let the user know that the value will be cleared.
source to share
The default autoComplete attribute minQueryLength
is 1 by default, and your search string will be updated on deletion until it is 1 character long.
etc .: You enter "foo" - and this string is provided to the search method (update after entering the first character - minQueryLength = 1)
But when you delete the search string - it is also updated until it is 1 in length.
Solution: set attribute minQueryLength="0"
Or:
if you need a larger value, add a condition autoCompleteMethod(String search)
:
if (search.length()<={your minQueryLength attribute} ) field = null;
source to share
Old question, but I think it is worth a different look.
The problem with minQueryLenth = 0 or minQueryLenth = 1 is that it can return hundreds of options (and of course, the user won't read all of them to select one). My solution was as follows.
First of all, I need an input to be sent to the server as soon as the user selects one of their values (in my case, the user is not allowed to proceed to the next step of the wizard if this value is null or empty). So I put the ajax function called in case of selected value.
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}" />
If the user clears the text, I need to send this value to "myViewScopedBean" and update the component that allows the user to proceed to the next step. I figured that adding a javascript function to be called when autocomplete loses focus.
JavaScript:
function autoCompleteLostFocus(autocompleteId, comand) {
if ($("[id='" + autocompleteId + "_input']").val().trim() == "") {
eval(comando);
}
}
in myViewScopedBean:
public void setValueNull() {
selectedValue = null;
}
Hope this helps. A lot of work, but the behavior is exactly what I wanted. The reason for the javascript function is that it just sends information to the servlet if the value is "", otherwise it does nothing.
source to share