Ik gebruik de jquery Dialog functie voor het openen van een popup waarin een formulier wordt geladen. Dit ziet er als volgt uit:
bedrijvenlogin.php
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Modal form</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<body>
<?php
echo "<a href='#' class='showpopup' data-id='11' data-cartid='22'>BEWERKEN</a>";
//dialog popup new order:
echo "<div id='dialog' class='dialog'>";
echo "<div id='message'></div>";
echo "</div>";
?>
</body>
</html>
<script>
$("a.showpopup").on("click", function(e) {
e.preventDefault;
$.ajax({
url: 'edit-bedrijf.php',
type: 'get',
data: {id: $(this).data('id')},
dataType: 'html'
})
.done(function(d) {
$("#message").html(d);
$("#dialog").dialog({
height: 600,
width: 750,
modal: true,
close: function(event, ui) { $('#wrap').show(); },
title: 'Nieuwe vermelding keuren'
});
})
.fail(function(){
alert('Oops');
}); // let op method chaining!!
return false;
});
jQuery('body')
.bind(
'click',
function(e){
if(
jQuery('#dialog').dialog('isOpen')
&& !jQuery(e.target).is('.ui-dialog, a')
&& !jQuery(e.target).closest('.ui-dialog').length
){
jQuery('#dialog').dialog('close');
}
}
);
</script>
Als ik dit script/file gewoon direct aanroep via de adresbalk dan werkt de popup gebeuren wel. Maar dan wordt de eigenlijke website er dus niet omheen geladen. Wanneer ik op de pagina binnen de website kom waar dit script staat werkt de popup functie niet.
Ik krijg dan de volgende foutmelding:
Oops... voorkom dat deze pagina extra dialoogvensters weergeeft
Ik kom hier echt niet meer uit. Wie heeft hier een verklaring voor...?
