Hide Name and Email fields from User Profile block

[Ben]

Agree that a temporary green button upon update is unclear. Not sure why a simple success message wasn’t deployed. Perhaps too many functions for this block to have a particular default message?

Since it’s been advised by Softr to use this block for onboarding after a user reaches it from the sign in with code block or magic link, can you please provide a code that simply removes the “Old password” field. Users haven’t entered a new password at this point in their journey, so it’s confusing when they see an “Old password” field. All they should see is the “New password” field.

Remove old password field from User Profile block (use case: users are initially invited with magic links)

<script> window.addEventListener('block-loaded-user-accounts1', () => { document.querySelectorAll('#user-accounts1 form')[1].children[1].style.display = 'none' }); </script> Insert this into Page Settings>Custom Code>Header or Footer and replace user-accounts1 to your respective User Profile block name

[Maria]

Hey folks, I have some good news. We deployed an improvement to show a success message when updating the profile or changing the password on the User Profile block

[AndyKot]

@Maria

<script>
    document.addEventListener("DOMContentLoaded", function () {
        $('#user-accounts2 #sw-form-capture-full_name-input').removeClass('sw-display-inline-block');
        $('#user-accounts2 #sw-form-capture-full_name-input').addClass('d-none');
        
        $('#user-accounts2 #sw-form-capture-email-input').removeClass('sw-display-inline-block');
        $('#user-accounts2 #sw-form-capture-email-input').addClass('d-none');
        $('#user-accounts2 .hr').addClass('d-none');
    });
</script>

I need a lot of help, I am trying to use the user profile block, because I need to update data quickly that affects the visibility of the components, the issue is that these fields were previously sent through a zappier cath and it is very slow, I used the option to show the information in tables and be able to view them but it doesn’t look good.

I have put the indicated code and it does not work, is there another alternative.

Thank you!!

[Astghik]

Hi folks, have an updated code for this purpose. Place it in page settings → Custom code → Head, replace the BLOCKID with your actual block name, save and preview/publish

<script>
window.addEventListener('block-loaded-BLOCKID', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>

[katedani]

I have tried the above code to hide the name and email field (only want the avatar field) but its not working.

<script>
window.addEventListener('block-loaded-user-accounts1', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>

[Maria]

Hi @katedani looks like the 3rd blockid in your code is not replaced with user-accounts1

It should be like this:

<script>
window.addEventListener('block-loaded-user-accounts1', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>

[katedani]

Thank you!