auto completar textbox

Ask the community
,
1

bom dia amigos, estou comecando com wix e com programação estou tentando replicar esse codigo mas sem sucesso até agora. Este é o link do codigo que estou tentando replicar

https://www.wix.com/corvid/forum/tips-tutorials-examples/example-repeater-dropdown-with-keyboard-navigation

const HL_COLOR = “rgba(190,190,250)”;
const REG_COLOR = “rgba(222,222,222)”;

let listSize;
let currIndex = -1;

$w.onReady(function () {

$w(‘#input’).onKeyPress((event) => {
setTimeout(() => {
if ($w(‘#input’).value.length === 0) {
currIndex = -1;
$w(“#rptDropdown”).collapse()
.then(() => {
console.log(“Done with collapse”);
});
} else {

switch (event.key) {
case “Enter”:
$w(‘#input’).value = $w(‘#rptDropdown’).data[currIndex].title;
$w(“#rptDropdown”).collapse()
.then(() => {
console.log(“Done with collapse”);
});
break;
case “ArrowLeft”:
case “ArrowRight”:
break;
case “ArrowUp”:
if (currIndex > 0) {
currIndex -= 1;
refresh_repeater();
}
break;
case “ArrowDown”:
if (currIndex < listSize - 1) {
currIndex += 1;
refresh_repeater();
}
break;
case “Escape”:
$w(‘#input’).value = ‘’;
currIndex = -1;
$w(“#rptDropdown”).collapse()
.then(() => {
console.log(“Done with collapse”);
});
break;
default:
currIndex = -1;
wixData.query(“Countries”)
.startsWith(“title”, $w(‘#input’).value)
.ascending(“title”)
.limit(5)
.find()
.then((res) => {
$w(‘#rptDropdown’).data = ;
$w(‘#rptDropdown’).data = res.items;
listSize = res.items.length;
$w(‘#rptDropdown’).expand();
});
break;
}
}
}, 50)
});
});

export function rptDropdown_itemReady($item, itemData, index) {
$item(‘#dataset1’).text = itemData.title;

if (index === currIndex) {
$item(“#rptBox”).style.backgroundColor = HL_COLOR;
} else {
$item(“#rptBox”).style.backgroundColor = REG_COLOR;
}

$item('#container1').onClick(() => { 
    $w('#input').value = itemData.title; 
    $w('#rptDropdown').collapse(); 
});

}

function refresh_repeater() {
$w(“#rptDropdown”).forEachItem(($item, itemData, index) => {
$item(‘#dataset1’).text = itemData.title;

if (index === currIndex) {
$item(“#rptBox”).style.backgroundColor = HL_COLOR;
} else {
$item(“#rptBox”).style.backgroundColor = REG_COLOR;
}

    $item('#container2').onClick(() => { 
        $w('#input').value = itemData.title; 
        $w('#rptDropdown').collapse(); 
    }); 
});

}

export function name_click(event) {
//Add your code for this event here:
console.log(‘clicked’)

}