0

I'm following the Animation example on http://jsblocks.com/ but I'm having problems.

I've copied it exactly, apart from changing the font-awesome href link and I've changed the title strings in script.js.

When I load my index.html all my items appear like in the example but when i use the search box it comes up with the wrong results.

For example, let's say my title strings are Barry, Freddy, and Patrick.

When I search for Patrick, it will either show no results or will show Barry and Freddy?

update So I've found that the search function does indeed work but only if you search for terms without the first letter of the word?

e.g. searching for Patrick will not show results but searching for atrick will?!

D4v3
  • 31
  • 11

2 Answers2

1

You can just call toLowerCase() on the items property you are searching within e.g. title in the jsblocks example. So for the example on the jsblocks website it would look like that:

var items = [
  { icon: 'cubes', title: 'Blocks' },
  /* ... */
];
var filterVal = blocks.observable();
blocks.query({
  filter: filterVal,
  items: blocks.observable(items).extend('filter', function (value) {
    return !filterVal() || value.title.toLowerCase().indexOf(filterVal().toLowerCase()) != -1;
  })
});
Kanaye
  • 11
  • 1
0

okay so I found a workaround for the problem but it's not exactly a perfect solution.

The problem was with the first letter of each string being capitalized; therefore, I changed all the title strrings to lowercase (which can be done using toLowerCase() or by using a site like https://convertcase.net/

D4v3
  • 31
  • 11