I'm creating a light box so that it runs based on the click on a link.
The light box works normally and I can add content inside it smoothly. The question is that in this particular I need to add a javascript that pulls one of my forms.
The javascript even prints inside the DIV but the browser does not run it. Can anyone tell me what I can do to resolve this?
Follow the code I'm using below.
jQuery(function ($) {
function createLightBoxForm() {
var linkForm = $('.pega-form').attr('value');
var bgLight = $('<div class="bg-lightbox"></div>');
var colorLight = $('<div class="color-lightbox"></div>').appendTo(bgLight);
var contLight = $('<div class="cont-lightbox"></div>').appendTo(bgLight);
var closeLight = $('<a class="close-btn-lightbox" href="#">X</a>').appendTo(contLight);
var formLight = $('<script type="text/javascript" src="//go.secnet.com.br/form/generate.js?id=' + linkForm + '"><\/script>').appendTo(contLight);
bgLight.appendTo('body');
}
$('body').on('click', '.ltbox-call', function(event) {
event.preventDefault();
createLightBoxForm();
});
$('body').on('click', '.close-btn-lightbox', function(event) {
event.preventDefault();
$('.bg-lightbox').remove();
});
$('body').on('click', '.color-lightbox', function() {
$('.bg-lightbox').remove();
});
});Result:
