My jQuery dialog always opens in the top left corner of my browser window.
The following shows my code after simplification.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
</head>
<body>
<input id='submit' type="submit" value="Submit">
<div id='dialog'></div>
<script>
$('#submit').click(function(event){
$(function() {
$('#dialog').dialog({
autoOpen: false,
width:500,
height:500,
position:'center'
});
});
$('#dialog').dialog('open');
});
</script>
</body>
</html>
Any ideas on what I need to do so that it opens positioned in the center?
It is highly1 unlikely that this is the cause of your problem, but I was having the same issue, and found this bit of code in jquery-ui.js :
// /1.10.0/jquery-ui.js:
target = $( options.of )
...
// line 12053
if ( target[0].preventDefault ) {
// force left top to allow flipping
options.at = "left top";
}
That bit of code checks to see if the target element has the preventDefault function defined. By default, target[0] is going to equal the window object, which does not have preventDefault. However, in my case, I had defined a function called preventDefault in the window object's global scope. My window.preventDefault caused the if-block to evaluate to true, thus overriding the default options.at value of "center".
As I said, it's highly1 unlikely that you have defined the function window.preventDefault, but that is what caused it for me.
1EDIT: based on the comments, it is actually not so unlikely. Glad I could help everyone.
Use this
<input id='submit' type="submit" value="Submit">
<div id='dialog'></div>
<script>
$('#submit').on('click', function(event){
$(function() {
$('#dialog').dialog({
autoOpen: false,
position:'center'
});
});
$('#dialog').dialog('open');
});
</script>
Greetings.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With