user generated content display on submit

Ask the community
,
1

hello,
I have created, using code, a submit button that sends data to a collection upon clicking on it (click-on function). I want to show the comment right after the user submits it.
I followed this https://www.youtube.com/watch?v=FVARVy3YS74 tutorial, but something doesn’t work. it only shows the comment after I go back to editor and then back to preview.
where to I put this code? what do I need to change?

function getData(){
let query = wixData.query(‘collection’);
return query.limit(1000).find().then(results=> {
console.log(‘getData’, results);
return results.items;
});
}
$w.onReady(()=> {
$w(“#dataset1”).onAfterSave( ()=> {
getData().then( (items)=> {
$w(“#repeater”).data=items;
});
});
});

thank you.

2

What comment are you talking about? I don’t see any comment in your code.

  • did you remember to import wixData?
  • Is your collection name = ‘collection’ ?
3

yes, I did import wix-data.
I’m sorry, I guess I didn’t explain myself good enough.
let’s assume my collection name is collection. I have managed to get the comment into this collection. now I want to display it in a repeater right after the user clicks on submit. how do I modify the code I added (which is taken from the youtube tutorial) the correct way to show comment in repeater?

4

@danielleaharon It’s still not really clear.
If you want to display a single comment why are you using a repeater? Why won’t you use a simple textbox?

5

@jonatandor35 because I want all comments to be shown. like youtube comments for example, the minute a user submits the comment, it is shown among other comments.

6

@danielleaharon so you have a repeater of comments. Yes?
So you should add to your code ( inside the $w.onReady() function) something like:

$w("#repeater").onItemReady(($i, iData, index) => {
$i("#text1").text = iData.comment;//use the property Id of the textbox and the collection field key
})
7

@jonatandor35 I don’t get it.
here is my submit button code:
export function button1_click(event, $w) {
let toInsert1 = {
“submitter_email”:userEmail,
“message_text”:$w(‘#textBox1’).value
};
wixData.insert(“comments”, toInsert1)
.then( (results) => {
let item = results;
} )
. catch ( (err) => {
let errorMsg = err;
} );
}

function getData(){
let query = wixData.query(‘comments’);
return query.limit(1000).find().then(results => {
console.log(‘getData’, results);
return results.items;
});
}
$w.onReady( () => {
$w(“#commentswrite”).onAfterSave( () => {
getData().then((items) => {
$w(“#repeater”).data = items;
});
});
});

now with this code, the new comment is shown only if after submit (in preview mode), I go back to editor, and then back to preview (and then is appears).
how do I make the new comment appear right after I click submit?
(#commentswrite is the dataset, set to write only.)

8

@danielleaharon as I said, add my code:

//....your code...
$w.onReady( () => {
    $w("#commentswrite").onAfterSave( () => {
        getData().then((items) => {
        $w("#repeater").data = items;
        });
    });
//ADD MY CODE HERE:
    $w("#repeater").onItemReady(($i, iData, index) => {
        $i("#text1").text = iData.comment;//use the property Id of the textbox and the collection field key
    })
});