Retrieving Member data and using it as metadata

Community Help
#1

Hey fam! :wave:
I am using Memberstack + Webflow + Snipcart for my project

I want to send the member details such as first-name, last-name , email and other form-field values as metadata to Snipcart.

I want to have these values as the values of key of metadata
In this format
data-item-metadata='{"key": "value"}'
where value will be, say email from Memberstack field

I tried using Mmeberstack function, getting retrieving them as mention in this article

<button class="buy-button data-item-metadata='{"memberEmail": "value"}' Buy </button>

I tried to inject members from MemberStack by using this formula

document.querySelector('.buy-button').dataset.itemMetadata["memberEmail"] = MemberStack.onReady.then(function(member) { return member.email });

But it doesn’t make any effect to the value and nothing is being passed from MemberStack.
Am I missing anything here? Any insights on this is very much appreciated🙏

#2

Hey Mohammed :wave:

Would you be willing to share your URL so we can take a look?

#3

Oh yeah, for sure.

This is the URL of my events page built in Webflow + MemberStack.

#4

After a quick glance it looks like your custom javascript code is wrong. Working on trying to fix it now.

1 Like
#5

What is member.secret?

#6

It returns the Webflow Collection ID of member.

#7

I believe the code should be something like this:

<script>

let button = document.querySelector(".snipcart-add-item");

MemberStack.onReady.then(function(member) { 

    let memberSecret = member["secret"];

    let memberID = member["id"];

    document.querySelector('button[data-item-custom2-name]').dataset.itemCustom2Name = memberSecret;

    button.dataset.itemMetadata["memberid"] = memberSecret;

});

</script>
1 Like
#8 
<script>

let button = document.querySelector(".snipcart-add-item");

MemberStack.onReady.then(function(member) { 

    if (member.loggedIn) {

        let memberSecret = member["secret"];

        let memberID = member["id"];

        document.querySelector('button[data-item-custom2-name]').dataset.itemCustom2Name = memberSecret;

        button.dataset.itemMetadata["memberid"] = memberSecret;

    }

});

</script>
1 Like
#9

Thanks @Josh-Lopez I am trying it now and looks like metadata is not getting filled by the id value.

When I console logged, I see the promisevalue is undefined.

image
image1460×570 64.4 KB

Any idea? :bulb:

#10

However there is an alternate way to pass metadata using Javascript API mentioned in the Snipcart api

await Snipcart.api.cart.update({
    email: 'john.doe@example.com',
    metadata: {
        customMetadataKey: 'value'
    },
    billingAddress:{
        name: 'John Doe'
    }
});

and then call using UpdateCartPayload.

Just linking them here in case if that would be better way to pass MemberStack data :thinking:

#11

so something like this?

<script>

    MemberStack.onReady.then(function(member) { 

        if (member.loggedIn) {

            let memberSecret = member["secret"];

            let memberEmail = member["email"];

            let memberID = member["id"];

            let firstName = member["first-name"];

            let lastName = member["last-name"];

            await Snipcart.api.cart.update({

                email: memberEmail,

                metadata: {

                    customMetadataKey: memberSecret,

                },

                billingAddress:{

                    name: firstName + " " + lastName,

                }

            });

        }

    });

</script>

I havent used snipcart so I’m not sure all the ins and outs about it.

1 Like
#12

Thanks so much @Josh-Lopez :+1: . I will try this code and might check with the Snipcart team for further debugging if any. Thanks again :smiley:

1 Like
#13

no problem Mohammed! :smiley:

1 Like