• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
    • Preguntas
    • Profesores
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Pruebas Online
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

209
Vistas
Div not showing, Azure AD B2C page customisation

I used popperJS to add a popover box when the user focuses on the password field. This is an Azure AD B2C page customisation. I can see the box element is there but it's not displaying. Any help is highly appreciated, thank you!

I can see the popover box is on the page

if (window.jQuery) {
  (function ($) {
    $(document).ready(function () {
      const passwordField = document.querySelector('input[id=newPassword]');
      passwordField.removeAttribute('title');
      passwordField.addEventListener('focus', () => {
        $('#newPassword').popover({
          trigger: 'focus',
          container: 'body',
          html: true,
          content: '<p>And here some amazing content. It is very engaging. Right?</p><p>TEST Test</p><p>TEST Test</p><p>TEST Test</p>',
          placement: 'right'
        });
      });
    });
  }(window.jQuery));
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.11.2/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.1.3/js/bootstrap.min.js"></script>
<input id="newPassword" class="textInput" type="password" placeholder="New Password" aria-label="New Password" aria-required="true">

almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

The issue was with the version of bootstrap.min.js. Azure AD B2C theme use bootstrap.min.css version 3.3.5 and it doesn't work with bootstrap.min.js of higher version. This resulted in the .fade class doesn't work properly and the opacity being set to 0.

Check your Azure AD B2C theme custom HTML and make sure there's no crash in the versions of bootstrap assets.

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda