Writing Repeater Item value to User Input Field?

Ask the community
, ,
1

Hello everyone,

I’m trying to build a publically visible wishlist function allowing members to create a wishlist of product (recorded into my created Wishlist dataset) that can then be shared to family and friends as a dynamic page.

I have a working version at the moment but the experience is poor. Currently on the Wishlist creation page I have a product repeater (and filters etc) and a series of user input fields - the user has to find the products they want via the repeater and then manually enter their names into the respective input field. Like I say, not ideal.

I want to add a button to my repeater/item, so that when a user clicks on this, the Title of the respective item is then written into the User Input field. I currently have a max of 15 fields (products that can be added per public Wishlist) and was going to use something like if field 1 is not blank write it to field 2 etc etc.

Does anyone have any ideas of how to go about getting this onclick function to work whereby it collect the item title and writes it to a user input field? I’ve made a start but currently I’m just getting undefined values when trying to write to any kind of element, so I think the way I’m collecting the item title is probably incorrect, but as I’m very new to this I could well have started off on the wrong foot too…

Any ideas?

Thanks in advance

2

Try this and check if it works →

#repeater1 repeater
#button1 button in the repeater
#input1 input out side the

$w('#repeater1').onItemReady(($item, itemData, index) =>   {
 $item('#button1').onClick((event) => {
   let title = itemData.title
    $w('#input1').value = title;
 });

})
3

Hi Ajit,

Thanks ever so much for your reply, really appreciated.

No luck unfortunately - Parsing error: unexpected token => as shown here

What do you think?

Thanks
Ashley

4

Sorry I have updated the code → 

$w('#repeater1').onItemReady(($item, itemData, index) => {
 $item('#button1').onClick((event) => {
   let title = itemData.title
    $w('#input').value = title;
 });


})
5

Hi Ajit,

Thanks ever so much for coming back to me - unfortunately though no luck, when I implement this code I get no action at all - no data is transferred into my user input at all.

I have created on another page a process that nearly achieves what I want - but not quite.

I’m currently able to collect the itemData.name and insert it into a user input - however it will only collect 1 .name per Repeater display. For example, with 12 items displayed in my dataset, clicking my Add button on item 7 (for example) will input it’s name into my first user input, however if following this I click my Add button on item 4 (for example), the .name from item 7 will again be added into my second user input field.

However, if I display just 1 item at a time per dataset, clicking my Add button on the single item displayed on page 1 will as before add this items .name into my user input, but if I then after this change to page 2 of this dataset and the single item on display in the repeater changes, clicking my Add button on this item adds this items .name into my second user input. The result: I get unique values in both my first and second user input fields, however the user experience is poor because I can only show one item at a time.

I have also tried to do this in an alternative way - add the product dataset into the target item (‘Wishlist’) dynamic page, however the products dataset is not selectable when I add a dataset to the page, despite others being available.

So, I think I need to find a way to, when adding the product items .name into the first user input field, to refresh the product dataset, so that the itemTitle2 variable can be re-populated on the next Add button click.

Any thoughts?

Please see my code so far below:

let itemTitle2;

export function repeater1_itemReady($item, itemData, index) {

itemTitle2 =  [itemData.name;](itemData.name;

})

[}](itemData.name;

})

export function addButton_click(event) {

if ($w( ‘#testInput’ ).value === “” ) {

    $w( '#testInput' ).value = itemTitle2; 

}  **else**  { 

    $w( '#testInput2' ).value = itemTitle2; 

}

}

Thank you in advance :smiley: