Only show edit or delete button in repeater if item belongs to current logged in user

Hey there,

I have a repeater that collects data inputted by users to display their post, containing elements such as an image, text and so on… I would like to show the #editMark and #deleteMark buttons on only to the author of the item (for example if I see a post I’ve created, I will need to see the edit and delete button but only on the posts I’ve created)? I’ve checked and tried a number of different codes on here with no success!

#repeater1
#editMark
#deleteMark

My code is pretty long so here’s a snap of the beginning

What you should use is the repeated scoop…

Assuming that userId is the field in the database which stores the userId…
…the code would be like →

#repeater1 - repeater
#editMark - button in the repeater
#deleteMark - button in the repeater
(you should put these code(s) under the $w.onReady() function )

$w("#repeater1").onItemReady(($item, itemData, index)=>{
 if(itemData.userId ==== wixUsers.cuurentUser.id) {
 $item('#editMark').show();
 $item('#deleteMark').show();
 }
  else {
      $item('#editMark').hide();
      $item('#deleteMark').hide();
   }
});

Hi Ajit, thank you for getting back to me! Unfortunately that didn’t work for me…I should add that the repeater is connected to its elements via code rather through connecting it to the database as so…

The collection is called ‘marks’

@paulogouveia From your code,
I don’t think there is any need for [0] in your code…
I think if there is [0] in your code, it would only show the first item…

And check if userId is the field where the userId is stored or not …

@ajithkrr The [0] is needed as I only wish for one user details per item (e.g. profile photo etc…). The userId is saved under _id?

@paulogouveia No!!! the userId of who inserted the data to database is stored in the _owner field…

for those interested…

$w (“#repeater1”). onItemReady (( $item, itemData, index ) => {
if (itemData._owner === wixUsers.currentUser.id) {
$item( ‘#editMark’ ).show();
$item( ‘#deleteMark’ ).show();
} else {
$item( ‘#editMark’ ).hide();
$item( ‘#deleteMark’ ).hide();
}
});

@ajithkrr Superstar!! Got it! The issue I now have is that the delete button deletes the most recent item rather than the chosen item?

Ok ! for the delete function →

#deleteButton - delete button in the repeater

$w("#repeater1").onItemReady(($item, itemData, index)=>{
 $item('#deleteButton').onClick((event) => {
  $item('#deleteButton').disable();
  let id = itemData._id;
  wixData.remove("marks", id)
  .then(() => {
   $w('#dataset1').refresh();
  });
  
 });
});

Thank you so much! The issue I had was with $w(‘#dataset1’).refresh(); as my repeater isn’t connected to a dataset, any other way to refresh the repeater? Ideally without refreshing the page?

On a separate note, the owners item on the same repeater contains their profile details (profile photo, full name and so on) I would like the user to be allowed to click onto a button that directs the user to the owner’s profile page? Could you assist with the code for this please? I have created a custom profile page as a dynamic page and the data is saved under ‘mymarks’.

Button = #profileClick
Repeater = #repeater1

Lastly (hopefully!), on this same repeater I would like to display two buttons. One #bookingButton and the other #buyButton. The idea is that if the user creates a post and they have a service in wix bookings, #bookingButton is shown on their item in #repeater1. Same concept for #buyButton and if they have a product in wix store - I’m not sure if this is possible?

Thank you so much in advance, i’ve spent hours looking through other posts and hopefully this will help others too.

@paulogouveia For your first query →
In which way you have connected the repeater???

For your second query →
Can you please post your dynamic page link…

For your third and last query →
You could open a new post as that is not related with this post…

@ajithkrr

first query →
Please see the image above with the repeater code (the one you mentioned about [0]. That’s how the elements are being connected to the dataset at the moment.

second query →
eventmark.co.uk/mymarks/{ID}/{Full Name}

third and last query →
will do!

First solution →
Instead of →

$w('#dataset1').refresh();

paste the code (the one I mentioned about [0])

Second solution →
When the button is clicked, you should query the database
For example :
“Humans” is your Database
The dynamic page link is mymarks/{ID}/{Full Name} (you don’t need eventmark.co.uk)

Then the code would be like →
#button1 - the button

$w('#repeater1').onItemReady($item, itemData, index) => {
$item('#button1').onClick((event) => {

 wixData.query("Humans")   // database Name
 .eq("_id", itemData._id)
 .find()
 .then((res) => {
  let fullName = res.items[0].fullName;
  let id = res.items[0]._id;
  
  wixLocation.to(`/mymarks/${id}/${fullName}`);
 });
 
});
});

Try and post if it works !!!

Third solution →
Will be answered by someone who have knowledge in it …

Happy coding !!!

Nearly there!

First solution →
I had removed $w(’ #dataset1 ').refresh() ; from your code if that’s what you meant?

I tried these but didn’t work also:
updateFields();
updateRepeater();

Second solution →
This code didn’t activate the onClick event, just didn’t do anything. I changed the quote marks from ’ ’ to " " and it seemed to like that better.

})
$item( “#profileClick” ).onClick(() => {
wixData.query( “mymarks” ) // database Name
.eq( “userId” , wixUsers.currentUser.id)
.find()
.then((res) => {
let fullName = res.items[ 0 ].fullName;
let id = res.items[ 0 ]._id;
wixLocation.to( “/mymarks/${id}/${fullName}” );
})

@paulogouveia Try to console the result and change “” to back ``

$w('#repeater1').onItemReady($item, itemData, index) => {
  $item("#profileClick").onClick((event) => {
                  wixData.query("mymarks") // database Name                  
                    .eq("_id", itemData._id)  
                                    .find() 
                                                       .then((res) => {
                                                       let fullName = res.items[0].fullName;
                                                       console.log(fullName);
                                                       let id = res.items[0]._id;    console.log (id);
                                                                           wixLocation.to(`/mymarks/${id}/${fullName}`);                    });
});

@ajithkrr the issue I have with this code now is that it only displays one users details regardless of which item is clicked on?

$item("#profileClick").onClick((event) => {
                wixData.query("mymarks") // database Name                    .eq("userId", wixUsers.currentUser.id)  
                    .find()
                    .then((res) => {
 let fullName = res.items[0].fullName;
                        console.log(fullName);
 let id = res.items[0]._id;
                        console.log(id);
                        wixLocation.to(`/mymarks/${id}/${fullName}`);
                    })
            })

Very Sorry there was an error →
(I have updated the above code also)

$w('#repeater1').onItemReady($item, itemData, index) => {
            $item("#profileClick").onClick((event) => {
                wixData.query("mymarks") 
                .eq("_id", itemData._id)                    .
                    .find()
                    .then((res) => {
 let fullName = res.items[0].fullName;
                        console.log(fullName);
 let id = res.items[0]._id;
                        console.log(id);
                        wixLocation.to(`/mymarks/${id}/${fullName}`);
                    })
            })
            });

thanks but I’m afraid that doesn’t work for me still strangely! On the live site when I click on the button nothing happens. I’ve had to keep the end }) as below as I have code following on…

thanks for continuing to help me on this much appreciated. any thoughts?

  $item("#profileClick").onClick((event) => {
                wixData.query("mymarks")
                    .eq("_id", itemData._id)   
                    .find()
                    .then((res) => {
 let fullName = res.items[0].fullName;
                        console.log(fullName);
 let id = res.items[0]._id;
                        console.log(id);
                        wixLocation.to(`/mymarks/${id}/${fullName}`);
                    })
            })

@paulogouveia Try this and see what you get either in the live or preview site

 $w('#repeater1').onItemReady($item, itemData, index) => {
   $item("#profileClick").onClick((event) => {
                wixData.query("mymarks")
                    .eq("_id", itemData._id)   
                    .find()
                    .then((res) => {
 let fullName = res.items[0].fullName;
                        console.log(fullName);
 let id = res.items[0]._id;
                        console.log(id);
                        wixLocation.to(`/mymarks/${id}/${fullName}`);
                    })
            })
 .catch( (error) => {
    let errorMsg = error.message;
    let code = error.code;
    console.log(errorMsg);
  } );
  });

Also check your database permissions →

This one just throws off the rest of the code and doesn’t work also…

Permissions seems ok…?

marks collection

mymarks collection