How to display user-specific listings on a Webflow dashboard using Memberstack and Make without exposing other users' IDs? Answered

Post author
Samuel Powell

Hey all, I'm wondering if someone can help with this. My problem is pretty straightforward but I'm going to provide some context:

I am creating a directory site using Webflow, Memberstack, and Make. Users can submit listings.
When a user signs up, they are added as a CMS item in a Members collection list. So each member is assigned both a User ID (Membertack) and Item ID (Webflow).

When users upload a listing, they create an item in a Listings collection. There is a hidden input field in the form which captures the logged-in user's User ID and Item ID. These are also stored in the Listing item, so that we can see who the uploader is.

Here's my issue:
I want to create a dashboard page, where a logged-in user can see the listings they have uploaded.

One way I thought of doing this was:

  1. Display the Listings Collection, including a hidden text field which has the User ID associated with the listing.
  2. Have a hidden input field which captures the logged in user's ID
  3. Use Finsweet's CMS Filter to filter the list by matching the IDs.

The problem with this approach is that, even though the other users' IDs will be hidden, they are still present on the page and could be accessed by someone. I'm not sure what someone could do with another member's ID, but it doesn't seem like good practice to expose it.

So instead, I thought I would have a hidden form on the page, populate it with the logged-in user's ID, and auto-submit it when the page loads. This is picked up in Make, and then I would filter the items based on matching User ID. Beyond that, I'm stuck. How can I get those items and bring them back to be displayed on the user's dashboard?

Thanks in advance!

Comments

6 comments

  • Comment author
    A J

    Hey Samuel Powell, have you checked this free template for your use-case?

    It has a similar use-case of showing only the deals that the logged in user has created, but instead of finsweet filtering (or hiding elements), it removes the items from the page if it does not match with the logged-in member's ID, does that sound like a feasible option for you?

    You can check out the dashboard page of the template to check how it is setup there. Hope this helps.

    0
  • Comment author
    Samuel Powell

    Hi A J this helped with my issue above, thanks. I also want users to be able to edit their listings, so I’ve also been following this template for that too. I’m able to have their text-based inputs pre-filled when a user opens up the modal to edit a listing, but some of the fields in mine are checkboxes - do you know if there’s a way to map cms to checkboxes? (I’m using cms switches)

    I wonder if anyone can help with this. When a user goes to edit a deal they created, the input fields are populated with the info from the item’s CMS. Can a similar thing be done with checkboxes? Can checkboxes be pre-filled with data from CMS switches for example?

    0
  • Comment author
    Raquel Lopez

    If you save the value as a boolean, you should be able to fill the checkboxes with the CMS data.

    Check out this article that shows you how to use checkboxes from Memberstack into Webflow components https://docs.memberstack.com/hc/en-us/articles/9061247720731-Single-Checkboxes

    And let us know if you have any doubts

    0
  • Comment author
    Samuel Powell

    Thanks for this Raquel Lopez, but I’m looking to take the value from the CMS in the same way that the input fields do in the above example.

    So let’s say there are 3 checkboxes and the user selected 1 and 2 when they created the deal, and that data is saved in the CMS, I’m wondering how I can pre-fill those checkboxes when the user opens the modal to edit the deal.

    0
  • Comment author
    Raquel Lopez

    You'll have to use javascript for it. I will recommend to use a custom element or a embed code with the checkbox as an HTML so it behaves like a HTML checkbox input. Webflow checkbox component works a little bit different, by also having to add a class to represent the checked state 😞

    <script>
document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('idOfYourCheckbox').checked = {{WEBFLOW_CMS_CHECKBOX_VALUE}};
  // add a line per each checkbox
})
</script>
    0
  • Comment author
    Samuel Powell

    Thanks Raquel Lopez! Got it working. Read-only link for anyone interested: https://preview.webflow.com/preview/cms-checkboxes-3f6933?utm_medium=preview_link&utm_[…]1e19c82cdf&pageId=676059b98158f8d31b42278b&workflow=preview

    0

Please sign in to leave a comment.