时间戳

首页 > 解决方案 > Azure B2C - 自定义策略 - 自定义 UI - 更改密码 _ 继续按钮禁用

azure-ad-b2c - Azure B2C - 自定义策略 - 自定义 UI - 更改密码 _ 继续按钮禁用

问题描述

我已遵循本教程“ https://github.com/azure-ad-b2c/samples/tree/master/policies/embedded-password-reset ”。一切运作良好。但是，当我尝试添加自定义 UI 页面以设置整个更改密码向导的样式时，电子邮件验证后“继续”按钮被禁用。此外，我找不到在更改密码工作流程中删除更改电子邮件按钮的方法。

我所做的唯一更改是添加自定义页面来样式更改密码页面。

<ContentDefinition Id="api.localaccountpasswordreset">
   <LoadUri>https://xxx.blob.core.windows.net/yyy/selfasserted.html</LoadUri>
   <Metadata>
      <Item Key="DisplayName">Local account change password page</Item>
   </Metadata>
</ContentDefinition>

自定义html页面

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            // Remove the provided password reset link
            $("#forgotPassword").remove();

            // Move the new password reset button to the right position
            $("#PasswordResetUsingEmailAddressExchange").detach().appendTo("label[for='password']");

            // Set the style of the password reset button to look like a link
            $("#PasswordResetUsingEmailAddressExchange").attr("style",
                "background: none!important; color:#2872DD; border:none;  padding:0!important; font-size: .75em;  height: auto; width: auto;  margin-left: 5px");
        });
    </script>
</head>
<body>
    <div id="api"></div>
</body>
</html>

标签： azure-ad-b2c

解决方案

使用 JavaScript 的 Azure AD B2C 指南指出您必须包含不同版本的 jQuery；否则，这会导致页面 UI 出现问题。

推荐阅读