Want to "call" multiple items from database according to user selection. Can you help?

CODE-NINJA · April 11, 2021, 7:20pm

Ok, how to recunstruct it ???

What you will need?

You will need to create several -->DropDowns -->with the followind ID-prefix-> " DD "
EXAMPLE : —> DD1 , DD2 , DD3 , DD4 , DD5 and so on.
You will need to create several -->CheckBoxes -->with ID-prefix-> " CB "
EXAMPLE : —> CB1 , CB2 , CB3 , CB4 , CB5 and so on.
You will need to add a → Table with the ID —> " table1 "
You will need to add a → DATASET → " dataset1 " & connect it with your Database .
Connect your DATASET also with your TABLE !
Add a TextField with the ID —> “resultCounter” (this will show RESULTS).
And add this modified and improved CODE here…
Modify parts inside the code like —> USER-INTERFACE-SECTION & REFERENCES

You can add as much DropDowns or Checkboxes as you want, but you also will have to add the new functions inside code (expand the code).

import wixData from 'wix-data';
import {local} from 'wix-storage';

var refFields = [], myFilter = [], MEMORY = []
//var MEMORY1, MEMORY2, MEMORY3, MEMORY4, MEMORY5, MEMORY6, MEMORY7
//--------- USER-INTERFACE / настройки --------------- User-Interface---------------------

var DATASET     = "#dataset1"
var DATABASE    = "Team"
//---------------------------------------
var REFERENCE1  = "anrede" 
var REFERENCE2  = "nationalitat" 
var REFERENCE3  = "berufserfahrung"
var REFERENCE4  = "verfugbarkeit"
var REFERENCE5  = "ausbildung" 
var REFERENCE6  = "bundesland" 
var REFERENCE7  = "sprache" 
//----- USER-INTERFACE / настройки ------------ User-Interface----------------------------
 
$w.onReady(async function () {
    refFields=[REFERENCE1, REFERENCE2, REFERENCE3, REFERENCE4, REFERENCE5, REFERENCE6, REFERENCE7]
 //MEMORY[MEMORY1, MEMORY2, MEMORY3, MEMORY4, MEMORY5, MEMORY6, MEMORY7]
 
//    RESET()
 
//    for (var i = 0; i < refFields.length; i++) {
//        MEMORY[i] = await local.getItem(refFields[i])
//        if(MEMORY[i]!==undefined) {$w('#DD'+(i+1)).value = MEMORY[i]}
//    }
 //Dropdown_Buttons-----------------------------------------------------------------------
    $w('#DD1, #DD2, #DD3, #DD4, #DD5').onChange(()=>{SEARCH_ENGINE();});
 //Checkbox_Buttons-----------------------------------------------------------------------
    $w('#CB1, #CB2, #CB3, #CB4, #CB5').onChange(()=>{SEARCH_ENGINE();});
 //Reset_Buttons--------------------------------------------------------------------------
    $w('#btnReset1').onClick(()=>{$w("#DD1").selectedIndex = undefined, SEARCH_ENGINE();})
    $w('#btnReset2').onClick(()=>{$w("#DD2").selectedIndex = undefined, SEARCH_ENGINE();})
    $w('#btnReset3').onClick(()=>{$w("#DD3").selectedIndex = undefined, SEARCH_ENGINE();})
    $w('#btnReset4').onClick(()=>{$w("#DD4").selectedIndex = undefined, SEARCH_ENGINE();})
    $w('#btnReset5').onClick(()=>{$w("#DD5").selectedIndex = undefined, SEARCH_ENGINE();})
 //Reset_Buttons--------------------------------------------------------------------------
 
 //Lokale-Datenabfrage (falls bereits gespeicherte Daten vorhanden sind)........
//  if(MEMORY1!==undefined) {$w('#DD1').value = MEMORY1, console.log("MEMORY1 = " + MEMORY1)}
//  if(MEMORY2!==undefined) {$w('#DD2').value = MEMORY2, console.log("MEMORY2 = " + MEMORY2)}
//  if(MEMORY3!==undefined) {$w('#DD3').value = MEMORY3, console.log("MEMORY3 = " + MEMORY3)}
//  if(MEMORY4!==undefined) {$w('#DD4').value = MEMORY4, console.log("MEMORY4 = " + MEMORY4)}
//  if(MEMORY5!==undefined) {$w('#DD5').value = MEMORY5, console.log("MEMORY5 = " + MEMORY5)}
 
 //const title6 = local.getItem('bundesland1');      $w('#CB1').value = title6;
 //const title7 = local.getItem('sprachen');         $w('#CB2').value = title7;
 //const title8 = local.getItem('sprachen');         $w('#CB21').value = title8;
 //const title9 = local.getItem('sprachen');         $w('#CB22').value = title9;
 
 //Options for CheckBox-1------------------------------
    $w('#CB1').options = [
    {"label": "Burgenland", "value": "Burgenland"},
    {"label": "Kärnten", "value": "Kärnten"},
    {"label": "Niederösterreich", "value": "Niederösterreich"},
    {"label": "Oberösterreich", "value": "Oberösterreich"},
    {"label": "Salzburg", "value": "Salzburg"},
    {"label": "Steiermark", "value": "Steiermark"},
    {"label": "Tirol", "value": "Tirol"},
    {"label": "Vorarlberg", "value": "Vorarlberg"},
    {"label": "Wien", "value": "Wien"},
    ];

 //Options for CheckBox-2------------------------------
    $w('#CB2').options = [
        {"label": "Englisch",       "value": "Englisch"},
        {"label": "Estnisch",       "value": "Estnisch"},
        {"label": "Finnisch",       "value": "Finnisch"},
        {"label": "Französisch",    "value": "Französisch"},
        {"label": "Deutsch",        "value": "Deutsch"},
        {"label": "Italienisch",    "value": "Italienisch"},
        {"label": "Rumänisch",      "value": "Rumänisch"},
        {"label": "Russisch",       "value": "Russisch"},
        {"label": "Schwedisch",     "value": "Schwedisch"},
        {"label": "Spanisch",       "value": "Spanisch"},
    ];
 
 
 //DropDown-Benennung....(Betitelung)
    wixData.query(DATABASE)
    .limit(100)
    .find()
    .then(results => {
 const uniqueTitles1 = getUniqueTitles1(results.items);
 const uniqueTitles2 = getUniqueTitles2(results.items);
 const uniqueTitles3 = getUniqueTitles3(results.items);
 const uniqueTitles4 = getUniqueTitles4(results.items);
 const uniqueTitles5 = getUniqueTitles5(results.items);
 
        $w("#DD1").options = buildOptions1(uniqueTitles1);  //---> STATUS
        $w("#DD2").options = buildOptions2(uniqueTitles2);  //---> ANREDE
        $w("#DD3").options = buildOptions3(uniqueTitles3);  //---> NATIONALITÄT
        $w("#DD4").options = buildOptions4(uniqueTitles4);  //---> VERFÜGBARKEIT
        $w("#DD5").options = buildOptions4(uniqueTitles5);  //---> AUSBILDUNG
    });
 
 function getUniqueTitles1(items)    {
 const titlesOnly = items.map(item => item[refFields[0]]);   
        return [...new Set(titlesOnly)];}
 function buildOptions1(uniqueList1) {
        return uniqueList1.map(curr => {
            return {label:curr, value:curr};
        });
    }
 
 function getUniqueTitles2(items)    {const titlesOnly = items.map(item => item[refFields[1]]);  return [...new Set(titlesOnly)];}
 function buildOptions2(uniqueList2) {return uniqueList2.map(curr => {return {label:curr, value:curr};});}
 
 function getUniqueTitles3(items)    {const titlesOnly = items.map(item => item[refFields[2]]);  return [...new Set(titlesOnly)];}
 function buildOptions3(uniqueList3) {return uniqueList3.map(curr => {return {label:curr, value:curr};});}
 
 function getUniqueTitles4(items)    {const titlesOnly = items.map(item => item[refFields[3]]);  return [...new Set(titlesOnly)];}
 function buildOptions4(uniqueList4) {return uniqueList4.map(curr => {return {label:curr, value:curr};});}
 
 function getUniqueTitles5(items)    {const titlesOnly = items.map(item => item[refFields[4]]);  return [...new Set(titlesOnly)];}
 function buildOptions5(uniqueList5) {return uniqueList5.map(curr => {return {label:curr, value:curr};});}
})
 
export function BTNsearch_click(event)  {SEARCH_ENGINE();}
 
function SEARCH_ENGINE() {console.log("Search-Engine started")
 let filter =  wixData.filter()  
 let item1, item2, item3, item4, item5, item6, item7
 
 //DD1-DD5 = DropDowns------------------------------------------------------
 if ($w('#DD1').value!=="")  {item1 = $w('#DD1').value, local.setItem(refFields[0], $w('#DD1').value)} //, MEMORY[0]=local.getItem(refFields[0])}
 if ($w('#DD2').value!=="")  {item2 = $w('#DD2').value, local.setItem(refFields[1], $w('#DD2').value)} //, MEMORY[1]=local.getItem(refFields[1])}
 if ($w('#DD3').value!=="")  {item3 = $w('#DD3').value, local.setItem(refFields[2], $w('#DD3').value)} //, MEMORY[2]=local.getItem(refFields[2])}
 if ($w('#DD4').value!=="")  {item4 = $w('#DD4').value, local.setItem(refFields[3], $w('#DD4').value)} //, MEMORY[3]=local.getItem(refFields[3])}
 if ($w('#DD5').value!=="")  {item5 = $w('#DD5').value, local.setItem(refFields[4], $w('#DD5').value)} //, MEMORY[4]=local.getItem(refFields[4])}
 
 if (item1!==undefined)      {filter = filter.eq(REFERENCE1, item1)}
 if (item2!==undefined)      {filter = filter.eq(REFERENCE2, item2)}
 if (item3!==undefined)      {filter = filter.eq(REFERENCE3, item3)}
 if (item4!==undefined)      {filter = filter.eq(REFERENCE4, item4)}
 if (item5!==undefined)      {filter = filter.eq(REFERENCE5, item5)}
 //DD1-DD5 = DropDowns------------------------------------------------------
 
 //Checkbox-Group-1-----[ Bundesländer ]------------------------------------------------
 if ($w('#CB1').value[0]!==undefined)  {item6 = $w('#CB1').value}
 if (item6!==undefined)  {console.log("Bundesland-filter aktiv.")    
 for (var i = 0; i < item6.length; i++) {
            filter = filter.eq(REFERENCE6, item6[i])
            console.log("Gewählte-Bundesländer ( " + i + " ) = " + item6[i] )
        }
    }
 else {console.log("Keine Bundesländer ausgewählt")}
 
 
 //Checkbox-Group-2-----[Sprachen ]----------------------------------------------------
 if ($w('#CB2').value[0]!==undefined)  {item7 = $w('#CB2').value}
 if (item7!==undefined)  {console.log("Sprachen-filter aktiv.")  
 for (var a = 0; a < item7.length; a++) {
            filter = filter.eq(REFERENCE7, item7[a])
            console.log("Gewählte-Sprachen ( " + a + " ) = " + item7[a] )
        }
    }
 else {console.log("Keine Bundesländer ausgewählt")}
 
    $w(DATASET).setFilter(filter)
    .then(()=>{
        console.log(myFilter)
        result_COUNTER()
        $w('#table1').refresh();
    })
}
 
function RESET (parameter) {
    $w("#DD1").selectedIndex = undefined;
    $w("#DD2").selectedIndex = undefined;
    $w("#DD3").selectedIndex = undefined;
    $w("#DD4").selectedIndex = undefined;
    $w("#DD5").selectedIndex = undefined;
    $w('#CB1').value = undefined;
    $w('#CB2').value = undefined;
    myFilter = []
}


//Result-Counter----------------------------------------------
function result_COUNTER() {
 let count = $w(DATASET).getTotalCount().toString();
    console.log("COUNT = " + count)
    $w('#resultCounter').text = count.toString()
}

A working example, which i created within about 15min you will find here…
https://www.media-junkie.com/filter-test

But this version is a pure DATASET-VERSION, and differs totaly from the the shown VERSION on this site…
https://www.media-junkie.com/pflegeservice

Let us tell the DATASET-VERSION —> the light version (Disabled Memory-Function & NO other functionalities).

Everything else you can see inside the code.

Now you should be able to reconstruct this example.

SOME EXTRA: To improve this little FILTER-PROJECT you could take a look onto this post.

All related DATABASES which are given in this example you will find here…
https://www.media-junkie.com/databases
Try to change DATABASE-SETTINGS and choose another DATABASE from given DATABASE-POOL. (“Team” / “Real-Estate” / “Worlds-Presidents” / “Skole” / “Courses” / “Salon-Village” / “Initiatives” / …and so on…)

To get the right Field-IDs of each DATABASE, take a look onto the given DB-Pics, or click in the RD-Data-Manager-Version…(after you have sette-up the Preset-Settings)
https://www.media-junkie.com/rd-database-manager
…onto

…a new menu will open…

…click on —> “Export-Data” and see what happens. Now you should be able to see all DATA-Field-IDs of the current DATABASE which you have selected.
Now you are able to fill the preset-settigs (dropdowns/selection-tags & checkboxes).

Example:
If you select a DATABASE which is not existing you wil get an ERROR.
For example: The database called —> “xxxx” is NOT-EXISTING in this interactive example.

Result: After you have saved and load again the current DB-Preset, you should get an ERROR-MESSAGE (which tells you → DATABAS do not exist).

BTW: Sorry for —> any ERRORs in my tool —> it’s still in developement

Topic		Replies	Views
Help on databases selection and then specific filterint Ask the community code , question	4	125	April 20, 2018
Question around use of the Tags field in database Ask the community code , question	3	165	September 7, 2020
SEARCH BAR WHO SEARCH'S BETWEEN MANY DATABASES Ask the community code , question	3	604	February 21, 2019
Filter by multiple fields Ask the community code , question	7	428	January 28, 2021
dropdown list with multiple selections to one DB field Ask the community code , question	7	2522	February 27, 2019

Want to "call" multiple items from database according to user selection. Can you help?

Related topics