How to bring a string of text into a filtered repeater

Ask the community
,
1

I am new in doing web code and need help to get a solution of my problem.
So far I was able to create filters of my dataset and hand it over to the repeater showing the correct data elements. The difficulty I have is when I create a string of text out of the dataset elements and want to bring this then into the repeater.
For that I created a function ´giveFilter´and ´makeRepeater´, see below.
This basically works correct visible in the repeater but not always, especially when I change the filter setting enlarging the number of datasets included.
Does anyone knows what I do wrong or what needs to be modified?
Below I copied the complete code I have so far.
Many thanks in advance
Stephan

$item(“#text9”).text = itemData.plz + " " + itemData.ortsname

import wixData from ‘wix-data’;

let ddf_Kategorie; ddf_Kategorie = “”;
let sf_Jahr; sf_Jahr= 2000;
let sf_Bereich; sf_Bereich = 20;
let ef_Text; ef_Text = “”

$w.onReady(() => {
$w(‘#dataset1’).setFilter(wixData.filter()
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
console.log (“OnReady1”)
})
export function input1_keyPress(event) {
setTimeout (() => {
ef_Text = $w (“#input1”).value
giveFilter()
},500)
console.log(ef_Text)
}

export function dropdown1_change(event) {
ddf_Kategorie = $w (‘#dropdown1’).value;
if ((ddf_Kategorie) === “Alle Kategorien”) { ddf_Kategorie = “”}
console.log(ddf_Kategorie)
giveFilter()
}
export function slider1_change(event) {
sf_Jahr = $w (“#slider1”).value
console.log(sf_Jahr)
giveFilter()
}
export function slider2_change(event) {
sf_Bereich = $w (“#slider2”).value
console.log(sf_Bereich)
giveFilter()
}
export function giveFilter () {
$w(‘#dataset1’).setFilter(wixData.filter()
.contains (‘abbildung’, ef_Text)
.contains(‘kategorie’, ddf_Kategorie)
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
console.log (“giveFilter”)
makeRepeater()
}
export function makeRepeater () {
$w (“#repeater1”).forEachItem( ($item, itemData, index) => (
$item(“#text9”).text = itemData.plz + " " + itemData.ortsname ))
console.log (“MakeRepeater”)
}

2

So not able to see anything directly broken in your code by eye and as you mention it works for the most part. But get effected by making the dataset larger what you are looking at is most likely the fact you no where wait for the data to be ready.
When looking at the API you will see sentences like this

$w("#myDataset").onReady( () => {

if you place this in the giveFilter() and in the onready() your waiting for the dataset to be ready before anything happens. If this does not work there is a similiar approach to repeater.

3

Hello Cleas,
many thanks for your help.
I inserted now the ‘onReady’ command (code attached) but still have the situation that often the created strings are not populated into the repeater.
Do you or anybody has an idea what the problem is and how to solve it.
Thx & Rgds
Stephan

import wixData from ‘wix-data’;

let ddf_Kategorie; ddf_Kategorie = “”;
let sf_Jahr; sf_Jahr= 2000;
let sf_Bereich; sf_Bereich = 20;
let ef_Text; ef_Text = “”
$w.onReady(() => {
$w(“#dataset1”).onReady( () => {
$w(‘#dataset1’).setFilter(wixData.filter()
.contains (‘abbildung’, ef_Text)
.contains(‘kategorie’, ddf_Kategorie)
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
console.log (“OnReadyDataSet”)
})
})
export function input1_keyPress(event) {
setTimeout (() => {
ef_Text = $w (“#input1”).value
console.log(ef_Text)
makeRepeater()
},500)
}

export function dropdown1_change(event) {
ddf_Kategorie = $w (‘#dropdown1’).value;
if ((ddf_Kategorie) === “Alle Kategorien”) { ddf_Kategorie = “”}
console.log(ddf_Kategorie)
giveFilter()()
}
export function slider1_change(event) {
sf_Jahr = $w (“#slider1”).value
console.log(sf_Jahr)
giveFilter()
}
export function slider2_change(event) {
sf_Bereich = $w (“#slider2”).value
console.log(sf_Bereich)
giveFilter()
}
export function giveFilter () {
$w(“#dataset1”).onReady( () => {
$w(‘#dataset1’).setFilter(wixData.filter()
.contains (‘abbildung’, ef_Text)
.contains(‘kategorie’, ddf_Kategorie)
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
console.log (“GiveFilter”)
makeRepeater()
})
}
export function makeRepeater () {
$w(“#dataset1”).onReady( () => {
$w (“#repeater1”).forEachItem( ($item, itemData, index) => (
$item(“#text9”).text = itemData.plz + " " + itemData.ortsname
))
console.log (“MakeRepeater”)
makeRepeater1()
})
}
export function makeRepeater1 () {
$w(“#dataset1”).onReady( () => {
$w (“#repeater1”).forEachItem( ($item, itemData, index) => (
$item(“#text10”).text = itemData.stasse + " " + itemData.hausnummer
))
console.log (“MakeRepeater1”)
})
}

4

Hi Cleas,

now I tried with the TimeOut function.
It seems this works.

import wixData from ‘wix-data’;

let ddf_Kategorie; ddf_Kategorie = “”;
let sf_Jahr; sf_Jahr= 2000;
let sf_Bereich; sf_Bereich = 20;
let ef_Text; ef_Text = “”
$w.onReady(() => {
$w(“#dataset1”).onReady( () => {
console.log (“OnReadyDataSet”)
giveFilter()
})
})
export function input1_keyPress(event) {
setTimeout (() => {
ef_Text = $w (“#input1”).value
console.log(ef_Text)
giveFilter()
},500)
}

export function dropdown1_change(event) {
ddf_Kategorie = $w (‘#dropdown1’).value;
if ((ddf_Kategorie) === “Alle Kategorien”) { ddf_Kategorie = “”}
console.log(ddf_Kategorie)
giveFilter()
}
export function slider1_change(event) {
sf_Jahr = $w (“#slider1”).value
console.log(sf_Jahr)
giveFilter()
}
export function slider2_change(event) {
sf_Bereich = $w (“#slider2”).value
console.log(sf_Bereich)
giveFilter()
}
export function giveFilter () {
setTimeout( () => {
$w(‘#dataset1’).setFilter(wixData.filter()
.contains (‘abbildung’, ef_Text)
.contains(‘kategorie’, ddf_Kategorie)
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
console.log (“GiveFilter”)
makeRepeater()
},900)
}
export function makeRepeater () {
setTimeout( () => {
$w (“#repeater1”).forEachItem( ($item, itemData, index) => (
$item(“#text9”).text = itemData.plz + " " + itemData.ortsname
))
console.log (“MakeRepeater”)
makeRepeater1()
},900)
}
export function makeRepeater1 () {
setTimeout( () => {
$w (“#repeater1”).forEachItem( ($item, itemData, index) => (
$item(“#text10”).text = itemData.stasse + " " + itemData.hausnummer
))
console.log (“MakeRepeater1”)
},900)
}

5

Now I found how it works:

import wixData from ‘wix-data’;
let ddf_Kategorie; ddf_Kategorie = “”;
let sf_Jahr; sf_Jahr= 2000;
let sf_Bereich; sf_Bereich = 20;
let ef_Text; ef_Text = “”
let itemHausnummer = “”
let itemAbstand = “”

$w.onReady (() => {
$w (“#repeater1”).onItemReady( ($item, itemData, index) => {
if (itemData.hausnummer === undefined) {itemAbstand = “”; itemHausnummer = “”}
else {itemAbstand = " “; itemHausnummer = itemData.hausnummer}
$item(”#text9").text = itemData.plz + " " + itemData.ortsname
$item(“#text10”).text = itemData.stasse + itemAbstand + itemHausnummer
giveFilter()
})
})

export function input1_keyPress(event) {
setTimeout (() => {
ef_Text = $w (“#input1”).value
console.log(ef_Text)
giveFilter()
},500)
}

export function dropdown1_change(event) {
ddf_Kategorie = $w (‘#dropdown1’).value;
if ((ddf_Kategorie) === “Alle Kategorien”) { ddf_Kategorie = “”}
console.log(ddf_Kategorie)
giveFilter()
}
export function slider1_change(event) {
sf_Jahr = $w (“#slider1”).value
console.log(sf_Jahr)
giveFilter()
}
export function slider2_change(event) {
sf_Bereich = $w (“#slider2”).value
console.log(sf_Bereich)
giveFilter()
}
export function giveFilter () {
$w(‘#dataset1’).setFilter(wixData.filter()
.contains (‘abbildung’, ef_Text)
.contains(‘kategorie’, ddf_Kategorie)
.between (‘aufnahmejahr’, sf_Jahr - sf_Bereich - 0.5, sf_Jahr + sf_Bereich + 0.5))
}