Fixing Wix address input and repeater issues

Ask the community
, , , ,
1

i have an address input box and next to it i have an add button, underneath i have a repeater which has a text input and a remove button which would be used to delete the entry. i want the repeater to be hidden until the add button is click,which has a text input and a button which would be used to remove the entry . when clicking the add button i want this data to be sent to a CMS, this will store the address what has been added..

this is the issue im having. so my repeater is ticked as collapse, which is what i need, but when i type the address (which auto finds the address) once i select that address and click my add button, my repeater doesn’t appear and nothing is displayed, please see below code. i think this is the error in my code $w(“#multiInput”).value = “”;
as it says type ‘string’ is not assignable to type ‘address’

do you have a fix for this please?

here is my key or ID

addressinput = #multiInput

add button = #addButton

repeater = #inputSelectionsRepeater

deletebutton = #removeButton

text input within repeater = #inputSelections

$w.onReady(function () {

let inputSelections = [];

const populateInputRepeater = () => {

}

$w(“#inputSelectionsRepeater”) .data = inputSelections.map((selection) => ({selection, _id: Math.floor(Math.random()*1000000).toString}))

$w(“#inputSelectionsRepeater”).onItemReady (($item, itemData) => {

$item(“#inputSelections”).text = itemData.selection;

$item(“#removeButton”).onClick(() => {

inputSelections = inputSelections.filter((selection) => selection !== itemData.selection); populateInputRepeater();

})

})

$w(“#addButton”).onClick(() => {

})

const selection = $w(“#multiInput”).value;

$w(“#multiInput”).value = “”;

inputSelections.push(selection);

populateInputRepeater();

$w(“#inputSelectionsRepeater”).expand();

})

2

Hi,

First off it is easier on the community if you use the preformatted text icon when adding any code, like this

$w.onReady(function () {

let inputSelections = [];

const populateInputRepeater = () => {

}

$w(“#inputSelectionsRepeater”) .data = inputSelections.map((selection) => ({selection, _id: Math.floor(Math.random()*1000000).toString}))

$w(“#inputSelectionsRepeater”).onItemReady (($item, itemData) => {

$item(“#inputSelections”).text = itemData.selection;

$item(“#removeButton”).onClick(() => {

inputSelections = inputSelections.filter((selection) => selection !== itemData.selection); populateInputRepeater();

})

})

$w(“#addButton”).onClick(() => {

})

const selection = $w(“#multiInput”).value;

$w(“#multiInput”).value = “”;

inputSelections.push(selection);

populateInputRepeater();

$w(“#inputSelectionsRepeater”).expand();

})

So the main issue is the address input does not return a plain string. It returns an address object. So this line is invalid

$w("#multiInput").value = "";

to clear the input use

$w("#multiInput").value = null;

There are also some other issues in the code.

  • populateInputRepeater() is empty, so the repeater never gets data.
  • toString is missing () in your _id.
  • onItemReady() is using .text on what you said is a text input. If it is a text input, use .value.
  • Your add button logic is outside the click handler.
  • Because Wix Data is async, the CMS insert should be awaited before refreshing the repeater.
3

Hi dan,

Thank you for your reply, this has been driving me mad! Lol.

Sorry about my formatting, I’m new to all of this, so I won’t lie I’ve copied this code from YouTube, I’m not a coder :frowning:

So this i can make the change, as i will just copy the code and paste it.

But this part i have no idea :cry:,

I hope you can help, please, again thank you for responding to my question. This is the only thing holding up my website for me to create my business, so hopefully you can help me more with this, I really appreciate it