How do I search a repeater using input that is not order-specific?

For example, if I search for “a n d” in my search bar I need to be able to get all the results in my repeater that have “a n d” BUT ALSO all the ones with “d n a” and “n d a” and “a d n”. Yet right now my search bar is only showing results with the first (“a n d”) option.

Thanks,
Neena

my code:

import wixData from "wix-data";
export function input1_keyPress(event, $w) {
console.log($w('#input1').value);
filter($w('#input1').value);
}
function filter() {
$w('#dataset1').setFilter(
wixData.filter()
.contains("title", $w("#input1").value)

);
}

You will first need to parse the search string “a n d” to result in an array. You can use the split() function:

let str = 'a n d';
let array = str.split(" "); 

This will result in the array: [‘a’, ‘n’, ‘d’]

You then want to use array in the hasAll() filter for the query:

$w('#dataset1').setFilter(
    wixData.filter()
    .hasAll("title", array)
);

This should get you going in the right direction. Have fun.

Do I need to replace ‘a n d’ in the first line of code to my search bar input id (#input1)? I’m not interested in just those 3 letters but rather any of the letters that someone can enter…

@sahaneena Yes, of course:

let str = $w("#input1").value
let array = str.split(" ");

It wouldn’t be so useful if you always searched for a n d.

@yisrael-wix Ok thanks so much! I’m such a beginner at this. I’ve tried inserting the code but it is not working. Where exactly would these two lines of code go? I tried after console.log and after filter (in the first chunk of code) and it did not work when I tried to test it out even though the code was not showing any red dots/errors.

import wixData from "wix-data";
export function input1_keyPress(event, $w) {
console.log($w('#input1').value);
filter($w('#input1').value);
}
function filter() {
$w('#dataset1').setFilter(
wixData.filter()
.contains("title", $w("#input1").value)
);
}

@yisrael-wix Here is what I tried…but it is throwing an error saying the array is not defined…

import wixData from "wix-data";
export function input1_keyPress(event, $w) {
let str = $w("#input1").value
let array = str.split("input1");
console.log($w('#input1').value);
filter($w('#input1').value);
}
function filter() {
$w('#dataset1').setFilter(
wixData.filter()
.hasAll("title", array)
);
}

Something like this:

import wixData from "wix-data";
    export function input1_keyPress(event, $w) {
    let str = $w("#input1").value
    let array = str.split("input1");
    console.log($w('#input1').value);
    filter(array);
}

function filter(array) {
    $w('#dataset1').setFilter(
        wixData.filter()
        .hasAll("title", array)
    );
}

You will need to familiarize yourself with basic coding concepts to accomplish what you want. There are a wealth of Javascript coding sites which will help you learn Javascript from basic to advanced - Javascript.info is a good one. The Corvid Resources page provides tutorials examples and articles on getting the most out of Corvid. We are happy to get you pointed in the right direction but you’ll need to take it from there. As questions or difficulties arise we are here to help.

Ok- I thought the forum was a place where I could get help on a specific coding issue rather than be pointed to general tutorials…it is confusing when you say ‘as questions or difficulties arise we are here to help’ because this is a specific question/difficulty… I will try elsewhere I guess but wix needs to understand that some of its users do not want to be told to go learn javascript to tweak a small part of their website. I hope in the future they are able to provide more helpful forums and add more detailed video tutorials for users.

@sahaneena We are unable to provide full solutions. The user can learn from the resources available and we’re happy to provide assistance. For projects that are more urgent, you may want to check out the @sahaneena - it’s a hub where you can look for Corvid (and other) experts for hire.

@yisrael-wix ok thanks