How to set-up a dropdown to display different databases content in a repeater.

Ask the community
,
1

Hey Guys,

I am trying to setup a dropdown that displays content in a repeater but each drop down menu would need to call from different databases. Is this possible? I have been youtubing and googling but I can’t see anything that shows how to setup a dropdown to filter info from multiple databases.

For example if I choose dropdown “apples” it will display “apples content” in the repeater/or table drawing from “applesDB” database. If I choose “oranges” it will display “oranges content” in the repeater/table from “orangesDB” database.

I have about 12 databases that I want info displayed from and I thought if I can set them up to display from a list in a dropdown that would be cleaner looking. But if it isn’t possible I’ll just be making separate links to each page to display the content individually on pages if its all too tricky.

Thanks for your help

Regards

Kirby

2

I am trying to setup a dropdown that displays content in a repeater but each drop down menu would need to call from different databases. Is this possible?

This is definetely possible, when you go the coding way.

You can create 2 DropDowns…

  1. first one you will choose the database you want to get data from (DropDownListView) → all your databases inside the list

2a) After choosing the right DB, you get all results from the selected DB inside the second DROPDOWN.

2b) The better way would eben be to load the selected DB-DATA directly into a REPEATER.

Everything can be done on just ONE-PAGE, you don’t have to jump trough pages.

You will need Wix-Data-API → to be found in the VELO-API-DOCS.

https://www.wix.com/velo/reference/wix-data

3

Thank you Velo ninja! It would be just one dropdown displaying a list of multiple items and each item needs to draw data fir display in a repeater individually.

So from the one dropdown:
item 1 - Item 1 database
Item 2 - Item 2 database

etc etc

Is that doable? Thank you so much for your answer

4

Yes, like i always say - - > everything is possible.

  1. Create first all your 12 or more DATABASES. Everything starts with the structure of your DBs.
  2. Create your CODE including all needed functions…

First import the WixData-API into your page (project)

import wixData from 'wix-data';

Next step, call the onReady-method…

$w.onReady(async function() {...........});

Declare all your DBs as variables inside an ARRAY…

let myDB s= ["collectionID1", "collectionID2", "collectionID3", ...............]

Also declare your used DATABASE-FIELDS…

let myDBFields ["dbField1", "dbField2", "dbField3", "dbField4"];

When you have done everything the right way, your code should look like the following one…

import wixData from 'wix-data'; 

let myDBs= ["collectionID1", "collectionID2", "collectionID3"];
let myDBFields = ["dbField1", "dbField2", "dbField3", "dbField4"];

$w.onReady(async() => {console.log("Page is ready...");
    let myQuery1 = wixData.query(myDBs[0]);
        myQuery1.find()
        .then((res)=>{console.log("RESULTS: ", res.items);})
        .catch(()=>{});
});

Do the same again, but instead of - → myDBs[0] ← - use - → myDBs[1]

import wixData from 'wix-data'; 

let myDBs= ["collectionID1", "collectionID2", "collectionID3"];
let myDBFields = ["dbField1", "dbField2", "dbField3", "dbField4"];

$w.onReady(async() => {console.log("Page is ready...");
    let myQuery1 = wixData.query(myDBs[1]);
        myQuery1.find()
        .then((res)=>{console.log("RESULTS: ", res.items);})
        .catch(()=>{});
});

This is just the first step → BASIC CODE to work with Wix-Data.
Expand your code adding forther LOGIC and FUNCTIONALITY, for xample adding - - > eq(dbField, VALUE)

import wixData from 'wix-data'; 

let myDBs= ["collectionID1", "collectionID2", "collectionID3"];
let myDBFields = ["dbField1", "dbField2", "dbField3", "dbField4"];
let myValue;

$w.onReady(async() => {console.log("Page is ready...");     
    $w('#myDropDownIDhere').onChange(()=>{
        myValue = $w('#myDropDownIDhere').value;
    });

    let myQuery1 = wixData.query(myDBs[0])
        myQuery1.eq(myDBFields[0], myValue)
        .find()        
        .then((res)=>{console.log("RESULTS: ", res.items);})
        .catch((err)=>{console.log(err);});
});

Now your DropDown, comes into game.

Try to understand the logic behind and how to complete your task.
Which further steps are needed ???

And do not forget to use the → CONSOLE <— it will help you to generate your code.

Another idea…

and another one…
https://www.wix.com/velo/reference/wix-data/wixdataquery/include