diff --git a/docs/src/behavior.md b/docs/src/behavior.md
index 452966997..e5ac9ae52 100644
--- a/docs/src/behavior.md
+++ b/docs/src/behavior.md
@@ -24,24 +24,34 @@ docsearch({
## `handleSelected`
-This method is called when a suggestion is selected. By default, DocSearch will
-redirect the browser to the results page at the related anchor, but you can
-override it to add your own behavior.
+This method is called when a suggestion is selected (either with a click or
+keyboard). By default, DocSearch will redirect the browser to the results page
+at the related anchor, but you can override it to add your own behavior.
-The method is called with three arguments:
+The method is called with the following arguments:
- `input`, a reference to the search `input` element. It comes with the
`.open()`, `.close()`, `.getVal()` and `.setVal()` methods.
-- `event`, the actual event triggering the selection. This can come from a click
- or a keyboard navigation.
+- `event`, the actual event triggering the selection.
-- `suggestion`, the object representing the current selection.
+- `suggestion`, the object representing the current selection. Contains a `.url`
+ key representing the destination.
+
+- `datasetNumber`, this should always equal `1` as DocSearch is searching
+ into one dataset at a time. You can ignore this attribute.
+
+- `context`, additional information about the selection. Contains
+ a `.selectionMethod` key that can be either `click`, `enterKey`, `tabKey` or
+ `blur`, depending how the suggestion was selected.
```javascript
docsearch({
[…],
- handleSelected: function(input, event, suggestion) {
+ handleSelected: function(input, event, suggestion, datasetNumber, context) {
+ // Default implementation is as follow:
+ input.setVal('');
+ window.location.assign(suggestion.url);
}
});
```
diff --git a/package.json b/package.json
index 752d5dcab..0e5201f68 100644
--- a/package.json
+++ b/package.json
@@ -76,7 +76,7 @@
"peerDependencies": {},
"dependencies": {
"algoliasearch": "^3.24.5",
- "autocomplete.js": "0.32.0",
+ "autocomplete.js": "0.33.0",
"hogan.js": "^3.0.2",
"request": "^2.87.0",
"stack-utils": "^1.0.1",
diff --git a/scripts/playground.html b/scripts/playground.html
index 12d9063b5..527c0e695 100644
--- a/scripts/playground.html
+++ b/scripts/playground.html
@@ -26,11 +26,13 @@
Assets are served from http://127.0.0.1:8080/
apiKey: '25626fae796133dc1e734c6bcaaeac3c',
indexName: 'docsearch',
inputSelector: '#q',
- // handleSelected(input, event, suggestion) {
- // console.info(input);
- // console.info(event);
- // console.info(suggestion);
- // },
+ handleSelected(input, event, suggestion, datasetNumber, context) {
+ console.info(input);
+ console.info(event);
+ console.info(suggestion);
+ console.info(datasetNumber);
+ console.info(context);
+ },
debug: true // Set debug to true if you want to inspect the dropdown
});
diff --git a/src/lib/DocSearch.js b/src/lib/DocSearch.js
index 310d9ed30..1ff4a723e 100644
--- a/src/lib/DocSearch.js
+++ b/src/lib/DocSearch.js
@@ -78,8 +78,6 @@ class DocSearch {
this.autocompleteOptions.cssClasses.prefix =
this.autocompleteOptions.cssClasses.prefix || 'ds';
- // eslint-disable-next-line no-param-reassign
- handleSelected = handleSelected || this.handleSelected;
this.isSimpleLayout = layout === 'simple';
@@ -101,19 +99,19 @@ class DocSearch {
},
]);
- // If user defined its own handleSelected, we prevent clicks on suggestions
- // link to do anything
- if (handleSelected) {
+ const customHandleSelected = handleSelected;
+ this.handleSelected = customHandleSelected || this.handleSelected;
+
+ // We prevent default link clicking if a custom handleSelected is defined
+ if (customHandleSelected) {
$('.algolia-autocomplete').on('click', '.ds-suggestions a', event => {
event.preventDefault();
});
}
- // Click on suggestions will follow the link, but keyboard navigation still
- // need the handleSelected
this.autocomplete.on(
'autocomplete:selected',
- handleSelected.bind(null, this.autocomplete.autocomplete)
+ this.handleSelected.bind(null, this.autocomplete.autocomplete)
);
this.autocomplete.on(
@@ -324,7 +322,14 @@ class DocSearch {
return suggestion => template.render(suggestion);
}
- handleSelected(input, event, suggestion) {
+ handleSelected(input, event, suggestion, datasetNumber, context = {}) {
+ // Do nothing if click on the suggestion, as it's already a , the
+ // browser will take care of it. This allow Ctrl-Clicking on results and not
+ // having the main window being redirected as well
+ if (context.selectionMethod === 'click') {
+ return;
+ }
+
input.setVal('');
window.location.assign(suggestion.url);
}
diff --git a/yarn.lock b/yarn.lock
index 18eb3507f..333e75f46 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -541,10 +541,10 @@ atob@^2.1.1:
resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.1.tgz#ae2d5a729477f289d60dd7f96a6314a22dd6c22a"
integrity sha1-ri1acpR38onWDdf5amMUoi3Wwio=
-autocomplete.js@0.32.0:
- version "0.32.0"
- resolved "https://registry.yarnpkg.com/autocomplete.js/-/autocomplete.js-0.32.0.tgz#a00eab44dcb9e573ebd8bb3178e7fe67466cd4f1"
- integrity sha512-GYGmOo0r2wLgUEYE5J9z9OSLb8e0SAicgDR1M1pHOvwQ0Hc1SLHR0EqjDhl+lhl01cYq2d7lLbsgRmaizgLqrA==
+autocomplete.js@0.33.0:
+ version "0.33.0"
+ resolved "https://registry.yarnpkg.com/autocomplete.js/-/autocomplete.js-0.33.0.tgz#33d460367e2e7b6c2fe424353d955e022fe4594c"
+ integrity sha512-J0F7BkPhYwXvfs8Skp6v2e2IHYv0SL8INyHYwb7nUpvKHr96g6zS8RNEFGEfEuO3ND+XUsesEMM59LlwQoLfoA==
dependencies:
immediate "^3.2.3"