How do you write the code so it highlights (or makes the text bold) the matched keywords to the words searched in the searchbar.
this is the code I have so far, which does work. I would just like the words that someone enters in the searchbar, then highlighted in the results.
import {local} from ‘wix-storage’;
import wixData from ‘wix-data’;
$w.onReady( function () {
var sameWord = local.getItem(“searchword”);
$w(“#SearchBar”).value = sameWord;
$w(“#SearchBar”).placeholder = sameWord;
$w(‘#Repository’).onReady( function () {
search();
});
});
export function SearchButton_click(event, $w) {
search();
}
function search(){
let searchvalue = $w(‘#SearchBar’).value;
let searchWords = searchvalue.split(’ ');
let query = wixData.query(‘Repository’)
.contains(‘title’, searchWords [0])
.or(wixData.query(“Repository”)
.contains(‘subject’, searchWords [0]))
.or(wixData.query(“Repository”)
.contains(‘author’, searchWords [0])
.or(wixData.query(“Repository”)
.contains(‘abstract’, searchWords [0]))
.or(wixData.query(“Repository”)
.contains(‘category’, searchWords [0]))
);
for ( let i = 1; i < searchWords.length; i++) {
query = query.or(wixData.query(“Repository”)
.contains(‘title’, searchWords[i]))
.or(query.or(wixData.query(“Repository”)
.contains(‘subject’, searchWords[i]))
.or(query. or(wixData.query(“Repository”)
.contains(‘author’, searchWords[i])))
.or(query. or(wixData.query(“Repository”)
.contains(‘abstract’, searchWords[i])))
.or(query.or(wixData.query(“Repository”)
.contains(‘category’, searchWords[i]))));
}
query.find()
.then(res => {
$w(‘#repeater1’).data = res.items;
});
}
Many thanks