Shared subfunction with variable

Ask the community
, ,
1

I have 4 dropdowns with the same code (below). As you can see they all share the same subfunction GetTitles. I would like to clean up the code and place that function once outside the others. What I can’t figure out is how to pass the correct value to VARIABLE , which is the name of a field key of a collection.

function DetailsSelection() {
    wixData.query("options")
        .ascending("title")
        .eq("style", $w("#styledropdown").value)
        .limit(1000)
        .find()
        .then(results => {
            const uniqueTitles = GetTitles(results.items);
            if($w("#detailsdropdown").valid) {
                $w("#detailsdropdown").options = BuildOptions(uniqueTitles);
                $w("#detailsdropdown").value = uniqueTitles[0];
            }
            else {
                $w("#detailsdropdown").options = BuildOptions(uniqueTitles);
            }
            LookBack();
        });

        function GetTitles(items) {
        const titlesOnly = items.map(item => item.VARIABLE);
        return [...new Set(titlesOnly)];
    }
}

I need to extract style, details, and colors from this array:

815×203 22.3 KB

I need to extract campaign and design from this array:

734×161 14.9 KB

Just to be clear… the VARIABLE is the identifier itself and not the string value it contains.

TY Corvid community.

1 Like
2

Did you find a solution for this?
I am also interessted on it.

3 
function GetTitles(items, field) {
        const titlesOnly = items.map(item => item[field]);
        return [...new Set(titlesOnly)];
    }

And pass the field you want to this function.

4

Yes, this looks very good!
Thanks J.D. :beers:

5

Ok, i could implement the new knowledge to my code. Very nice! Big THANKS!

For Edgar Sanchez a little example?

var REFERENCE1  = "referencefield-1" 
var REFERENCE2  = "referencefield-2"
var REFERENCE3  = "referencefield-3"
var REFERENCE4  = "referencefield-4"
var REFERENCE5  = "referencefield-5"

var refFields = []
refFields.push(REFERENCE1, REFERENCE2, REFERENCE3, REFERENCE4, REFERENCE5)

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};
        });
    }
//and so on.........
6

You’re welcome.
But you have some extra code.
You’re better have it one time only.
Like:

/....
refFields.push(REFERENCE1, REFERENCE2, REFERENCE3, REFERENCE4, REFERENCE5)
let uniqueTitles = refFields.map(e => getUniqueTitles(items, e));
//you get back an array that contains 5 arrays filtered by unique fields.
//...
function getUniqueTitles(items, field)   {
 const titlesOnly = items.map(item => item[field]);   
 return [...new Set(titlesOnly)];}
 function buildOptions1(uniqueList1) {
 return uniqueList1.map(curr => {
 return {label:curr, value:curr};
        });
    }
7

@jonatandor35
Uffffff, i am honest, this .map-function is not really my best friend :sweat_smile:
But i will try to understand it. Perhaps in few months, i will know more about this .map-function and will be able to work with it.

At moment i have a hard time to work wiht .map

I just see very often, that you are using exactly this .map-function.

EDIT : And of course THANKS for all the good hints.

8

@russian-dima if you find .forEach to be clearer, you can use it:

let uniqueTitles = [];
refFields.forEach(e => uniqueTitles.push(getUniqueTitles(items, e)));

But I prefer using .map() as it’s shorter and also considered to be faster (which is not important at all in case of short arrays)

9

@jonatandor35
Yes for-each is more simply for me. But i also want to know the .map-function .
I will take a closer look on it soon. Perhaps i will come back with some questions again, when i start my analyses in relation to —> .map :nerd_face:

P.S. Your tips give me the knowledge to code in a much more flexible way, i mean to use more variables and make the code more flexible and not static.
For example, creating flexible User-Interfaces.

I was missing and searching for exactly this one…

function GetTitles(items, field) {
        const titlesOnly = items.map(item => item[field]);
        return [...new Set(titlesOnly)];
    }

And with the post of Sanchez and your reply, now i got it! :beers:
—> Coding-Skill-Upgrade😁

Also a thanks to Sanchez, for his questioning post.

10

@russian-dima
You guys are next level!
This is what my working code looks like:

//DROPDOWNS
function DetailsSelection() {
    wixData.query("options")
        .ascending("title")
        .eq("style", $w("#styledropdown").value)
        .limit(1000)
        .find()
        .then(results => {
         const uniqueTitles = GetTitles(results.items, "details");//<VARAIABLE here
         if($w("#detailsdropdown").valid) {
                $w("#detailsdropdown").options = BuildOptions(uniqueTitles);
                $w("#detailsdropdown").value = uniqueTitles[0];
            }
            else {
                $w("#detailsdropdown").options = BuildOptions(uniqueTitles);
            }
            LookBack();
        });
}

//SUBFUNCTIONS
function GetTitles(items, field) {
    const titlesOnly = items.map(item => item[field]);
    return [...new Set(titlesOnly)];
    }

function BuildOptions(uniqueList) {
    return uniqueList.map(current => {
    return {label:current, value:current};
    });
}

Now, applying these techniques, I will attempt to subfunction .query which I also have several instances of.

Big thanks @J.D. and @russian-dima… I love you guys!

11

@eimimitu
Team-Work :wink:

12

@eimimitu you’re welcome.
But I don’t get this line:

 const uniqueTitles = GetTitles(results.items, ["details"]);//<VARAIABLE here

as a second argument you should not pass an array but a string.

13

@jonatandor35
correct… good catch.
I was creating a double layer array which was still working but incorrect.
I updated my post.
TY JD