Streaming live at 10am (PST)

Populate e-commerce checkout form with memberstack

Hi,
I’m trying to pre-populate input fields such as “email, name, shipping address etc” with memberstack costume fields. Works very good with all fields that are outside the Webflow Checkout page. On the checkout page I can see the data shows up and then 1 sec later the page gets a refresh and all the data is deleted.

Any thoughts? or how I can fix it?

Thanks a lot!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

I believe you can’t because the webflow ecommerce cookie (which is server side) overwrites whatever memberstack has filled. I’ve tried it with no success. Would be glad to know if someone has managed to do that !

I will let you know if I find any solution :slight_smile: . Any other ideas how I could populate the checkout … trying to find a workaround :slight_smile:

I could solve it :slight_smile: I used Memberstack Front end API to populate the date after page load :slight_smile:
Here is the code:
Inside:

<script>
var memberprofile;

MemberStack.onReady.then(function(member) {
   membername = member["name"]
   memberemail = member["email"]
   memberaddress = member["address"]
   memberzip = member["zip"]
   membercountry = member["country"]
   membercity = member["city"]
   memberstate = member["state"]
});

</script>

Before:

<script>
window.onload = function memberprofile() {
		document.getElementById("name").value = membername;
document.getElementById("email").value = memberemail;
document.getElementById("address").value = memberaddress;
document.getElementById("zip").value = memberzip;
document.getElementById("country").value = membercountry;
document.getElementById("city").value = membercity;
document.getElementById("state").value = memberstate;
}
</script>

Of course you need same ID on the field in webflow in on the custom field in Memberstack :slight_smile:

1 Like

Awesome, did you check if the info is really passed while checking out for real ? And not overwritten by some obscure autocomplete or webflow cookie ?
If it works you’ve just solved a huge painpoint for me :slight_smile: I’ll try to test it out as soon as I find the time

Yep,.,all good. the data was on the order confirmation, orders in webflow… everywhere :slight_smile:

the only thing I’m searching now… is that when there is no data to be populated, then it writes “undefined” and I needs it to be empty :slight_smile:

Let me know how it goes for you :slight_smile:

Have you tried testing the values after the second part of your code and if undefined or ’ ’ just empty the inputs ?

yep, that’s what I did

<script>
window.onload = function memberprofile() {
		document.getElementById("name").value = membername
    document.getElementById("email").value = memberemail;
    document.getElementById("address").value = memberaddress;
    document.getElementById("zip").value = memberzip;
    document.getElementById("country").value = membercountry;
    document.getElementById("city").value = membercity;
    document.getElementById("state").value = memberstate;
   if (membername == undefined || membername == "", memberemail == undefined || memberemail == "", memberaddress == undefined || memberaddress == "", membercity == undefined || membercity == "", memberstate == undefined || memberstate == "", memberzip == undefined || memberzip == "")
{ return true }
}
</script>

the only thing is sometimes it works and sometimes it doesnt. It works on the first load the page, if refreshed it doesnt, shows up undefined. Am I missing something?

I’m not a pro at javascript but it seems you tell your function here that if values are empty return true. Shouldn’t you return false ?
Otherwise why not say if value are empty, set input to ’ ’ ?

I just tried your code and can’t seem to make it work.
Could you please tell me where exactly you’ve added each script ?
I still have the bug you said: it loads fine and then webflow clear’s the memberstack info after a second…

the first code is in the head (Inside) and the second is in body ( before) of the page custom code.
make sure that you have all the ID right, because what loads in the first second., that is not the code. the code should load after the page load. so if it doesnt show. something is not correct in the code.

Ok, so I’ve done the right thing… but still experiencing the problem.
Adding a timeout helps, but it seems that if there is a user session with a webflow cookie from a previous visit, it conflicts somehow in my case…

Hi @Anna3 & @pepperclip I’m trying to overcome this exact issue but have been unable to get these scripts working in my site. Can you confirm if this solution does still in fact work in the current Webflow checkout page and/or of you’ve made any modifications in the last ~6 months to it? Thanks