Changing Multiple Searches in Wix Code into just the one search

Hi, I currently have two basic searches set up on a page of a website, one for finding a musician’s name and another one for finding a word within a song name, then both search results are shown in the same results table.

However, is there a way that I can change the code so that I can have just the one search box for when people want to find either a musician’s name or part of a word from a song if they can’t remember the full song name?

I’ve looked on Wix Code Forum and can see code answers for multiple searches, however that is through searching a database with repeaters displayed on the page and people can choose from drop down options too, whereas I have just my repertoire database which is an alphabetical list of songs and the musician’s name which people can search through.

Talking of drop down, is there also a way to change the musican’s name search from a word search and have it as a drop down search instead, albeit with some of the code being able to edit out duplicates of any musician’s name, as I’ve tried adding a drop down choice for the musician’s name instead and I can never get it to hide any duplicates.

This is the code that I’ve used and is working fine as separate searches for either finding musician name or word/s from song name:

import wixData from ‘wix-data’;

//For full API documentation, including code examples visit http://wix.to/94BuAAs

$w.onReady(function () {
//TODO: import wixData from ‘wix-data’;
});

export function searchButton_onClick(event) {
wixData.query(‘RepertoireList’)
.contains(‘songName’, $w(‘#songnameinput’).value)
.find()
.then(res => {
$w(‘#resultsTable’).rows = res.items;
});
}

$w.onReady(function () {
//TODO: import wixData from ‘wix-data’;
});

export function searchButton1_onClick(event) {
wixData.query(‘RepertoireList’)
.contains(‘artistName’, $w(‘#artistnameinput’).value)
.find()
.then(res => {
$w(‘#resultsTable’).rows = res.items;
});
}

Any help for a novice wix coder would be must grateful, thank you!

something like this…

import wixData from ‘wix-data’

$w.onReady( function () {

$w('#searchButton1').onClick( **function**  () { 

    wixData.query("firstCollectionName") 
        .contains("collectionFieldKey1", $w("#searchInput1").value) 
        .or(wixData.query("firstCollectionName") 
            .contains("collectionFieldKey2", $w("#searchInput1").value)) 
        .find() 
        .then((results1) => { 

let results1Items = results1.items;
console.log(results1Items);

              $w('#resultsTable').rows = results1Items; 
        }) 
}) 

})

1 Like

Hi Mike and thank you for your help with this.

I have tried using your code supplied and changed the appropriate parts, unfortunately it doesn’t seem to want to work properly when published.

The search function itself works, but it doesn’t show any results in the table , it only flashes the results table and it just shows a white empty table instead of the results.

Although it does seem to be showing up the results underneath this white empty box as you can see the results appear in the table just before it flashes to white only and the page amount changes to correspond with the amount of multiple results.

The error log only tells me that there is an issue with line 14 of the code which is this line of code: console.log(results1Items);

This is what I had set it up to:

import wixData from ‘wix-data’

$w.onReady(function () {

$w('#searchButton').onClick(function () { 

    wixData.query("RepertoireList") 
        .contains("songName", $w("#searchInput").value) 
        .or(wixData.query("RepertoireList") 
            .contains("artistName", $w("#searchInput").value)) 
        .find() 
        .then((results1) => { 

let results1Items = results1.items;
console.log(results1Items);

              $w('#resultsTable').rows = results1Items; 
        }) 
}) 

})

If there is a simple fix for this then it would be great as can have just the one search.

Thanks again for your help, it is much appreciated.

After another look at it, I’ve now got it all working fine with this:

import wixData from ‘wix-data’

$w.onReady(function () {

$w('#searchButton').onClick(function () { 

    wixData.query("RepertoireList") 
        .contains("songName", $w("#searchInput").value) 
        .or(wixData.query("RepertoireList") 
            .contains("artistName", $w("#searchInput").value)) 
        .find() 
        .then((results) => { 

let resultsItems = results.items;
console.log(resultsItems);

              $w('#resultsTable').rows = resultsItems; 
        }) 
}) 

})

Thanks again for your help as without it I wouldn’t have got this done.

@givemeawhisky

good stuff

Hello, is it possible to have the same code working with dataset?