CODEWITHSUNDEEP
javascripthtmlsearch
Kermitt Davis
Kermitt Davis

Reputation: 1

Implement fuse.js.io function

all. I am trying to implement the fuse.js.io search function from, well, fuse.js.io. I have already linked the fuse.js to my HTML as well as a search.js with the variables: 

    var list = [   {
    title: "The Adventures Of Huckleberry Finn",
    author: {
      firstName: "Mark Twain",
    }
 },];

The script, from Fuse, that is in my HTML is as followed: 

    <script type="text/javascript"
    var options = {
       shouldSort: true,
threshold: 0.6,
location: 0,
distance: 100,
maxPatternLength: 32,
minMatchCharLength: 1,
keys: [
"title",
"author.firstName"
]
};
var fuse = new Fuse(list, options); // "list" is the item array
var result = fuse.search("");


</script>

Question:

How do I link the search.js that contains:

    var list = [   {
    title: "The Adventures Of Huckleberry Finn",
    author: {
      firstName: "Mark Twain",
      }
    },];

to my HTML as an actual search feature that returns keys. Also, there are no console errors I just don't know how to turn the scripts into a real feature.

Upvotes: 0

Views: 577

Answers (1)

rimraf
rimraf

Reputation: 4126

Simply import it into your html like so

<script src='path/to/script'></script>

or you can require it in your current script tags like so

<script>
require('path/to/file')
... your code here ...
</script>

Update: To include external scripts in your html you need to do so inside the tag like so

<html>
  <head>
    <link rel='stylesheet' ... ... ... // and so on
    <script src='https://cdnjs.cloudflare.com/ajax/libs/fuse.js/3.0.4/fuse.min.js'></script>
    <script src='path/to/your/own/js/file'></script>
  <head>
  <body>
    ... your html goes here. 
    You can also include <script> tags 
    in your html. The Load order is important so remember to 
    load your libraries (fuse.js) in the <head> so you have access 
    to it in the body
  <script>
    // javascript goes here 
    let something = 'this is fine for including js in your html'
    // OR if you want to create a separate file you can include it like so
    require('path/to/file')
  </script>
  </body>
</html>

Upvotes: 1

Related Questions