In this sample, we cover those topics:
- how to instanciate the helper
- listen to the
resultevent and read the results from Algolia - trigger a search to algolia
See on jsFiddle
Last active
June 24, 2016 13:21
-
-
Save bobylito/0a8e77b2fd0694046e986e0138feb697 to your computer and use it in GitHub Desktop.
Helper getting started, step 1: first search
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #search-box { | |
| margin: 1em 1em 3em; | |
| width: calc(100% - 2em); | |
| padding: 1em; | |
| border: 1px solid #ccc; | |
| border-radius: 2px; | |
| box-sizing: border-box; | |
| } | |
| #facet-list, | |
| #container{ | |
| max-width: 150px; | |
| width: 100%; | |
| float: left; | |
| padding: 0 1em; | |
| margin: 0; | |
| list-style: none; | |
| } | |
| #facet-list li { | |
| padding: 6px 0; | |
| border-bottom: 1px solid #ccc; | |
| } | |
| #facet-list li input { | |
| margin-right: 6px; | |
| } | |
| #container { | |
| max-width: calc(100% - 150px - 4em); | |
| } | |
| #container li { | |
| padding: 8px 0; | |
| } | |
| #container em { | |
| background: yellow; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <pre id=container></pre> | |
| <script src="https://cdn.jsdelivr.net/g/algoliasearch@3(algoliasearchLite.min.js),algoliasearch.helper@2"></script>` |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Config | |
| var applicationID = 'latency'; | |
| var apiKey = '249078a3d4337a8231f1665ec5a44966'; | |
| var index = 'bestbuy'; | |
| var client = algoliasearch(applicationID, apiKey); | |
| var helper = algoliasearchHelper(client, index); | |
| helper.on('result', function(content) { | |
| renderHits(content); | |
| }); | |
| function renderHits(content) { | |
| $('#container').html(JSON.stringify(content, null, 2)); | |
| } | |
| helper.search(); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Helper getting started / step 1 | |
| description: First search with the helper | |
| authors: | |
| - Algolia | |
| resources: | |
| - https://cdn.jsdelivr.net/algoliasearch/3.15.1/algoliasearchLite.min.js | |
| - https://cdn.jsdelivr.net/algoliasearch.helper/2.10.0/algoliasearch.helper.min.js | |
| normalize_css: yes | |
| wrap: b |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment