In below code, both buttons are supposed to toggle the pop-up, but only one works.
The first button (SUBMIT) will submit the form but the popup refuses to open
The second button (TEST) doesn't submit the form but the popup shows up
I don't understand why it isn't working. The first button is supposed to submit the form AND open the popup.
<script type="text/javascript" src="https://www.ni-dieu-ni-maitre.com/scripts/jquery.fancybox.js?v=2.1.1"></script>
<link rel="stylesheet" type="text/css" href="https://www.ni-dieu-ni-maitre.com/scripts/jquery.fancybox.css?v=2.1.1" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
$('.fancybox').click(function() {
$.fancybox.open({});
});
$("#popupajouterpanier").fancybox({
openEffect: 'elastic',
openSpeed: 150,
closeEffect: 'elastic',
closeSpeed: 150,
width: 500,
height: 300,
scrolling: 'no',
padding: 15
});
$("#popupajouterpanier2").fancybox({
openEffect: 'elastic',
openSpeed: 150,
closeEffect: 'elastic',
closeSpeed: 150,
width: 500,
height: 300,
scrolling: 'no',
padding: 15
});
});
</script>
</head>
<body>
<div id="ribbonmenu">
<div class="ribbon">
<a href="https://www.ni-dieu-ni-maitre.com/commande.php" rel="nofollow" class="navlink basketUrlHolder" id="navlink">BASKET </a>
<span class="basket-counter">0</span></a>
</div>
</div>
<script src="https://www.ni-dieu-ni-maitre.com/shop-controller.js"></script>
<form action="" style="padding: 0px;" method="post" name="tshirt_form" id="tshirt_form" onload="hideProgress()">
<input type="hidden" name="product" id="productId" value="1000933638" />
<input type="hidden" name="article" id="articleId" value="16047246" />
<input type="hidden" name="view" id="currentView16047246" value="351" />
<input type="hidden" name="color" id="productColor16047246" value="2" />
<select class="b-core-ui-select__select" id="size" name="size" onchange="redirect(this);">
<option selected value="3">M</option>
</select>
<select class="b-core-ui-select__select" id="quantity" name="quantity">
<option selected value="1">1</option>
</select>
<a style="position:relative;top:10px;" onclick="document.getElementById('loader').style.display='block';hideProgress()" id="popupajouterpanier" href="#inlinepopupajouterpanier">SUBMIT</a>
</form>
<a style="position:relative;top:10px;" onclick="document.getElementById('loader').style.display='block';hideProgress()" id="popupajouterpanier2" href="#inlinepopupajouterpanier">TEST</a>
<div style="display: none;">
<div id="inlinepopupajouterpanier2" style="width:550px;height:350px;text-align:center;">
if this popup shows up, then it's working !!!!
</div>
</div>
