GregHBushnell GregHBushnell - 2 months ago 9
PHP Question

modal function not showing the modal

Hi im writing a function that i can reuse to show/hide modals and on my website
but it does not seem to work. when i used the same code outside a funtion and using direct id and class names instead of variables it worked fine its only when im passing them in that it does not appear to work?

<input id="lrBtn" type="button" value="Login/Register" onclick="ShowModal('PopUpLR','closeLR');" />




function ShowModal(var popup,var closeBtn){
var modal = document.getElementById(popup);
var span = document.getElementsByClassName(closeBtn)[0];
modal.style.display = "block";
span.onclick = function() {
modal.style.display = "none";
}
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
}

Answer

The way you define your ShowModal function is wrong You need to write it like this

function ShowModal(popup,closeBtn){
 // your code
}

instead of

function ShowModal(var popup,var closeBtn)
{
// your code
}

Full code:

function ShowModal(popup,closeBtn){
        var modal = document.getElementById(popup);
        var span = document.getElementsByClassName(closeBtn)[0];
        modal.style.display = "block";
        span.onclick = function() {
            modal.style.display = "none";
        }
        window.onclick = function(event) {
            if (event.target == modal) {
                modal.style.display = "none";
            }
        }
    }
Comments