UI customization for the sign-up process with Azure AD B2C

Question

I wonder if it's possible with Azure AD B2C, to display the form from the sign-up policy with 2 screens : - the first one with only the verification process (email field, send verification code button, secret code fied, ....), - the second one with all the data we want (password, country, name)

The webview needs also to be customized but it's not a problem here.

Thx !!

Answer 1

I will tell you what we did to "solve" this issue . We basically created a SPA-like page the had steps to simulate the multiple screens. So you create DIVs that contain the HTML elements for each step. Using JavaScript you hide/display the elements depending which step you are in. On your final step your Create Account button will actually call $('#continue").click(); so that the normal MS processing can occur.

That was our original solution which had all sorts of custom HTML elements that mapped back to MS "api" elements. We have since prune down the attributes needed for a signup so it is all in one step now. We are refactoring the whole page to only use the MS-provided "api" elements. I hope this was helpful.

Answer 2

Full and complete instructions of what and how can be customized is described here.

A detailed sample customization is provided here.

To answer you question - no, you can not create two separate screens for single action (sign-up).