I have a list of clothing items and a variable [gender] that contains value for example “♂️” male. Some items on the list of clothing also contain emojis ♀️ or ♂️ in them, something like “Batman suit♂️”. I’m trying to exclude all items with ♀️ if “gender==♂️” and vice versa. I’ve tried to use clothingTop.selectAll.filter(newlist =>newlist.tags.includes([gender])), ald also match(/♀️/i), I’m not sure how to proceed.
it’s a mess of a text to go through but here it is https://perchance.org/imageconstructor basically, you would want to find “[clothingList.Top.joinItems(‘<\option>’)]” in the html part where I put this list as options into the select form.
Something like this worked:
clothingList.Top.selectAll.map(a => a.getName).filter(a => gender.includes('♀️') ? !a.includes('♂️') : !a.includes('♀️')).joinItems('<\option>').map(a => a.getName)- returns the name of the item, and not the item under it, and not a list since.selectAllreturns an object and not a string.filter(a => gender.includes('♀️') ? !a.includes('♂️') : !a.includes('♀️')- checks if the gender is female, if so, then filter out the items with ♂️ (!a.includes('♂️')essentially says if the name doesn’t have♂️, then return it), else filter out items with ♀️Also I’d recommend using
$outputon the list, so you just have to callclothingList.Toplike so:clothingList // clothing top, bottom, footwear, headwear, accessories, color, pattern Top $output = [this.selectAll.map(a => a.getName).filter(a => gender.includes('♀️') ? !a.includes('♂️') : !a.includes('♀️')).map(a => `<option value=${this[a]}>${a}</option>`).join('')] --- Any None Bikini top♀️ bikini top Blouse♀️ blouseThanks for the detailed explanations. I’m getting this error: "An error has occurred somewhere in your code (in lists or HTML): There’s a problem with the syntax of this expression: ‘[clothingList.Top.selectAll.map(a => a.getName).filter(a => gender.includes(’♀️’) ? !a.includes(‘♂️’) : !a.includes(‘♀️’)).joinItems(‘<\option>’)]'. Here’s the message that was returned when execution failed: Cannot read properties of undefined (reading ‘includes’).
On my end, there doesn’t seem to be any problems? What method are you using, directly on the HTML, the
$outputmethod, or both? If both, then there might be a problem.I put [clothingList.Top] in the HTML and $output line in the lists and it works. I just need to change the item references now in the lists itself. clothingList.Top[clothingGroup][clothingTop].joinItems(", ") doesn’t work anymore since there are no items inside to join.
How do I work with $output now in the list section to call an individual item from the list? I used to do it like this [clothingList[clothingGroup][clothingTop].joinItems(", ")] where clothingGroup is the html optgroup and clothingTop is the name of the item(‘this.value’). ${clothingTop[clothingGroup][clothingTop]} or clothingList[clothingGroup][clothingTop] returns undefined. Sorry for the noob question, as you can tell I’m new at this :-)
I forgot to enclose the
value=${this[a]}with quotations, so that is one problem. You can remove thevalueof the option if you are using the value to access back the list like so:$output = [this.selectAll.map(a => a.getName).filter(a => gender.includes('♀️') ? !a.includes('♂️') : !a.includes('♀️')).map(a => `<option>${a}</option>`).join('')]So that
clothingTopwill return the list name e.g.Dress♀️, then using it with[clothingList[clothingGroup][clothingTop]]should return the item below it i.e.evening dress with deep neckline.Setting the value to
this[a]would have the value of the option set directly toevening dress with deep necklineand notDress♀️so[clothingList[clothingGroup][clothingTop]]would not work, but you can access the value directly withclothingTop.Yeah that works, much appreciated! I noticed that the value was different from the name, it was lowerCase and no emoji that’s why I couldn’t call it.
Just what I wanted with the $output. Much appreciated, works like wonders!