So I'm trying to figure out how Semantic UI's Search module works. I've been testing it on some test data:
const testdata = [
{
"id": 7,
"created_at": "2020-03-24 08:40:42",
"updated_at": "2020-03-25 10:10:59",
"name": "NameX",
"email": "namex@email.no",
"phone": "94860509"
},
{
"id": 8,
"created_at": "2020-03-25 10:11:10",
"updated_at": "2020-03-25 10:11:10",
"name": "NameY",
"email": "namey@gmail.com",
"phone": "94860509"
},
{
"id": 9,
"created_at": "2020-03-31 15:55:06",
"updated_at": "2020-03-31 15:55:19",
"name": "Lucifer",
"email": "lucifer@gmail.com",
"phone": "58893177"
},
{
"id": 10,
"created_at": "2020-03-31 15:55:41",
"updated_at": "2020-03-31 15:55:41",
"name": "Morningstar",
"email": "morningstar@gmail.com",
"phone": "12345678"
},
{
"id": 11,
"created_at": "2020-04-01 16:13:39",
"updated_at": "2020-04-01 16:13:39",
"name": "Superwhale",
"email": "superwhale@gmail.com",
"phone": "18181818"
}
];
Currently, it seems like it's actually making the search. There are two names with the word "name" in them - NameX
and NameY
, and it's giving me two results, the problem is that those results are just blank.
[https://i.sstatic.net/568XV.png
This is how the search element is configured:
$('.ui.search').search({
source: testdata,
showNoResults: true,
ignoreDiacritics: true,
searchFullText: false,
searchFields: [
'name'
]
});
I've been going through the documentation and it seems like it should work, but it doesn't. Am I missing something obvious?
I figured out what the problem was. The search module of Semantic UI expects certain keys, so my equivalent "name" would have to be "title". I fixed it by going through the JSON and replacing every occurance of
"name":
with
"title":
I tried using
fields: {
title : 'name'
}
but that didn't work for some reason.