Create Multiple Query for Same or Different collection and display results on a Table or Repeater

About Filtering

While there may be a copious amount of combinations and possibilities to create a query, we have gathered a few of the most popular codes for you to practice. We have triggered all of our functions using a button, but the code can be modified for onKeyPress or onChange depending on the logic of your arrangement.

When writing the code, it is important to know the different types of filter functions that can be used. For example:

• eq // Equals

• contains // Contains

• ascending // Sorts by ascending order

• descending // Sorts by descending order

• limit // Limits the number of items returned

• le // Less Than or Equal to

• ge // Greater or Equal to

• lt // Less Than

• gt // Greater Than

To view other filter functions see the Corvid Reference: https://www.wix.com/corvid/reference/wix-data/wixdataquery

---

Good to Know #1

Query 1 field by using 1 input element value

Our example assumes NO elements are connected to a dataset.

The elements we used in this example:

• 1 Database collection / 'databaseName'

• 1 Table element hidden on load / #table1

• 1 Text input element / #searchField

• 1 Button element used to trigger search filter / #button1

• 1 field from the database used to search / 'description'

Code using onClick event via Properties Panel

import wixData from 'wix-data';

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

export function button1_onClick() {
    wixData.query('databaseName')
        .contains('description', $w('#searchField').value)
        .limit(30)
        .find()
        .then(res => {
            $w('#table1').rows = res.items;  //If using a repeater, then replace .rows with .data
            $w('#table1').show();
        });
}
        

Code using onClick via code without using Properties Panel

import wixData from 'wix-data';

$w.onReady(function () {
 //TODO: import wixData from 'wix-data';
    $w("#button1").onClick((event) => {
        wixData.query('databaseName')
            .contains('description', $w('#searchField').value)
            .limit(30)
            .find()
            .then(res => {
                $w('#table1').rows = res.items;  //If using a repeater, then replace .rows with .data
                $w('#table1').show();
            });
    });

});

---

Good to Know #2

Query more than 1 field by using 1 input element value

Our example assumes NO elements are connected to a dataset. We only use 1 input element to search multiple fields in the database collection. The logic of the code is only searching for one or the other, not both.

The elements we used in this example:

• 1 Database collection / 'databaseName'

• 1 Table element hidden on load / #table1

• 1 Text input element / #searchField

• 1 Button element used to trigger search filter / #button1

• 1 field from the database used to search / 'description'

• 1 field from the database used to search / 'title'

• 1 field from the database used to search / 'author'

Code using onClick event via Properties Panel

import wixData from 'wix-data';

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

export function button1_onClick() {
    wixData.query('databaseName')
        .contains('columnIdName', $w('#searchField').value)
        .or(wixData.query('secondDatabase').contains('author', $w('#searchField').value)) //You can search the same or different database
        .or(wixData.query('databaseName').contains('title', $w('#searchField').value)) //You can search the same or different database
        .limit(30)
        .find()
        .then(res => {
            $w('#table1').rows = res.items; //If using a repeater, then replace .rows with .data
            $w('#table1').show();
        });
}
        

Code using onClick via code without using Properties Panel

import wixData from 'wix-data';

$w.onReady(function () {
 //TODO: import wixData from 'wix-data';
    $w("#button1").onClick((event) => {
        wixData.query('databaseName')
            .contains('columnIdName', $w('#searchField').value)
            .or(wixData.query('secondDatabase').contains('author', $w('#searchField').value)) //You can search the same or different database
            .or(wixData.query('databaseName').contains('title', $w('#searchField').value)) //You can search the same or different database
            .limit(30)
            .find()
            .then(res => {
                $w('#table1').rows = res.items; //If using a repeater, then replace .rows with .data
                $w('#table1').show();
            });
    });

});

---

Author

by Code Queen

Services world wide

Stuck on a project? Hire Code Queen, LLC!

Schedule a phone call or video call directly online. In a different time zone? No problem! Code Queen currently has clients around the world.

Online Booking: Discovery Session

Contact Form: Send project details