Conditionally Hide an Element Based on Member Data

Article author
Josh Lopez

This approach is used when you want to hide an element based on if the currently logged-in member has data in a custom field.

Example Use Case:

You are displaying custom fields on a profile page but do not want to have blank sections/elements. In the scenario below we will be hiding a "favorite color" custom field if the member has not entered any data.

window.$memberstackDom.getCurrentMember().then(({ data: member }) => {
  if (member && member.customFields["favorite-color"] == null) {
const elem = document.getElementById('favoriteColor')
elem.style
.display='none';
}
});

Usage:

Replace the bolded placeholder entries with your own custom field id and the element id.

Was this article helpful?

Comments

1 comment

  • Comment author
    Connor Finley

    Would it be possible to do this depending on the logged in members plan? If I remember, you could do it with 'if((member.membership.id ==' in V1, but is it different in V2? Thanks!

    0

Please sign in to leave a comment.