Auth0 Home Blog Docs

Auth0-lock Dynamic signUpTitle

lock
login

#1

Hi,

Is there a way for to change the signUpTitle of the lock component without calling new Auth0Lock again?

I’m looking for something like the following here
However I am not hosted.

What I am looking to do is something like the below which does not work.

var options = {
languageDictionary: {
title: ‘loginTitle’,
signUpTitle: ‘signUpTitle’,
}
}

var lock = new Auth0Lock(‘clientID’, ‘account.auth0.com’, options);

lock.authorize({signUpTitle: ‘newSignUpTitle’});`

Then some where down the line call it again to change the title in the text.

lock.authorize({signUpTitle: ‘anotherSignUpTitle’});

At the moment I am calling new Auth0Lock('clientID', 'account.auth0.com', options); every time I need to change the title.

However performance concerns were brought up and with re instancing it and I am now looking for another solution.


#2

Hi! You wrote lock.authorize() in the code sample. Did you mean lock.show()?

If so, unfortunately the languageDictionary option is not one of the options that can be overridden when using show().


#3

Thank you for your reply I wasn’t expecting it to be so quick!

I am using lock.show() I saw that hosted there was something that looked like it dynamically update the signUpTitle and was hoping that there was something similar for non-hosted that I could call multiple times without creating a new auth0Lock object.

So is the design if you want to change the title you must re-instance the object?


#4

So is the design if you want to change the title you must re-instance the object?

That is correct. The thread you posted to mentions changing the title based on the parameters used to request an authorization but Lock is instantiated just once.

The languageDictionary is designed to address translation or branding needs, but dynamically changing text is not in scope. What is the use case that requires changing the title on the fly?


#5

Thank you for taking the time to clarify the authorize({}) it is much appreciated.

My use case is I have multiple different actions that show the lock and I need the signUpTitle to be different depending on which action the user clicked.


#6

But isn’t the sign up flow always the same, regardless of the action that the user is trying to accomplish after signing up?


#7

The flow is the same after the lock shows.
The change is cosmetic which is why the question was asked if it needed to be re-instanced.

Which I guess the take away is yes it must be re-instanced?


#8

Yes, to change the text you must create a new instance of Lock. Another option is to not create the instance until you know what text you are going to need.


#9

It’s when the user cancels the action they clicked that we change the text on subsequent actions.

However I believe this answers my question for now.

Thank you for taking the time to explain.