Repeater from user input not showing on mobile.

Ask the community
,
1

Hi all, I need a little advice please. I have a repeater showing info from a dataset which is populated from a user input field.

All is working well on the desktop site BUT nothing at all is showing on the mobile version. The repeater is not hidden on mobile and shows in the editor and mobile preview.

I should also add - nothing in the repeater shows on Firefox desktop either!

I have this simple code to refresh the repeater after user input (I suspect the problem is here as I have other data repeaters which work correctly on the page)

$w.onReady( () => {
$w(" # songswrite “).onAfterSave(() => {
$w(” # songsread ").refresh();
});
});

Thanks for any help you can offer.

2

Hi Janet,

This code is failing since refresh() is not a function. The Wix editor should show a squiggly red line underneath refresh() with a red dot in the margin. If you hover the mouse over it, it tells you what the problem is.

Firefox and the mobile browser apparently evaluate the line while loading and fail at that point.

3

The code editor is not showing any errors, neither in editor or preview.
Is there something I should use to replace refresh?

4

862×366 22.6 KB

5

Also, it works on desktop in Chrome and Safari but not Firefox or mobile Safari.
Thanks for helping out!

6

This is what I was referring to. “#Songsread” is a repeater, right?

7

Is the user input inside the repeater or outside?

8

@tony-brunsman Thanks for helping out!!
Yes, its a repeater, but as you can see from my screenshot I didn’t get the error. This is so strange as it worked for 2 days as I had it but now it is not working (still not seeing the red error message in the code though.)

I have now removed the code now and am trying some on click code on the SUBMIT button I have for the form where the data is entered.

Is this the right way to go? Do you have any suggestions? My client has a whole choir waiting to enter song choices for their next rehearsal :tired_face:

9

@janet You probably didn’t see the question up further. I’ll repeat it:

Is the user input inside the repeater or outside?

10

@tony-brunsman Yes, so sorry, I missed that!

The user input is outside the repeater in a form entry. This is working and populating the database I am trying to read from after the user enters their comment. (sorry I am probably using the wrong terms here, I am just delving into code!!)

I really appreciate your help!!

11

I see why my code wasn’t showing an error, ‘songswrite’ is a dataset for the form entry and ‘songsread’ is the dataset (not the repeater) I was using for the repeater to read the entry. (Sorry, I’m a bit stressed as my client is pushing!)

12

@janet I don’t usually populate repeaters via datasets unless I know I’m not going to need to do any dynamic updating of them. I do it with queries and code because of the flexibility to get the result that I want. But I’ve been coding a long time.

I would need to know more about what the field names are that are tied to the repeater. There probably is a way to do it with a dataset. Using the forEachItem function comes to mind.

13

I’m just reading the repeaters section in the Corvid references, I will see if I can make it work with forEachItem…

I only have 2 items in the repeater data: ‘title’ and ‘song’.

This is for a choir member to list a song for other members to see.

14

@janet You can do it without forEachItem. The inputs in this example are not connected to the dataset. Adjust naming as needed.

export function button1_click(event) {
 let toInsert = {"title": $w("#inpTitle").value,
   "song": $w("#inpSong").value};
    wixData.insert("ChoirSongs",toInsert)
    .then((InsertResult) => {
        console.log("Insert Successful");
        $w("#dataset1").refresh();
    })
}
15

Working on this… thank you!

16

Thank you, I tried this! This is a bit too much for my level of coding though. I’m not even sure what needs adjusting! I’m still trying as I want to learn more and am so thankful for your help here. Do I need the import wixdata from ‘wix-data’; first?

17

@janet Yes, put the import line at the top of the page above the onReady statement, if you have one.

The toInsert object is actually pretty simple once you see what it’s asking for. It’s just a field name in quotes with a colon after it, followed by the value that you want to insert. In this case, it’s the value of an input box. That’s one field assignment. If you have more, you separate them by commas and then another field name in quotes, followed by a colon and a value.

All the wixData.insert function needs is the actual name of the collection that you have the dataset configured to in quotes followed by the toInsert object.

The purpose of the .then line is to give the insert function time to insert the record into the collection before you do anything that you have in mind after the insert. In this case, you want to refresh the dataset, so that the newly added record displays in the repeater.

18

Thank you, this is really helpful. I am taking a break right now and have put a temporary, manual solution on the live page. I will try again in an hour as I want to master this!!

19

The strange thing about all this is that the code I had originally worked for most on desktop, but not at all on the mobile site. I already had 14 successful entries before they stopped showing in the repeater!