ansaurus

Question

Answer 1

A:

So what's wrong with the code you provided? Is it not working or...?

As far as I can see, that would work perfectly. I would suggest you use $(function() { instead of $(document).ready(function(){. It's shorter and easier to read. :P

Salty 2009-02-07 01:16:18

Shorter doesn't equal easier to read. I think $(document).ready() is perfectly comprehensible and very descriptive.

tvanfosson 2009-02-07 01:41:12

I agree with @tvanfosson in any of my presentation I use $(document).ready(func) because i think its actually easier to read that way.

bendewey 2009-02-07 01:54:36

Answer 2

+3 A:

Your div tag isn't properly formatted and it needs to be closed. The following worked for me, but it needs proper CSS files.

<html>
<head>
<script type="text/javascript" language="javascript"
        src="jquery/jquery.js"></script>
<script type="text/javascript" language="javascript"
        src="jquery/jquery.ui.js"></script>
<script type="text/javascript" language="javascript">
    $(document).ready(function(){
        $("#example").dialog();
    });
</script>
</head>
<body>
    <div id="example" class="flora" title="This is my title">
        I'm in a dialog!
    </div>
</body>
</html>

tvanfosson 2009-02-07 01:51:13

Answer 3

A:

Wayne Khan is right in that

the default behavior is to open when you call dialog(), unless you set autoOpen to false.

and tvanfosson has it nearly correct, though the default dialog is not Modal. To display a modal window, you must set the modal option to true

To illustrate, here's a trimmed-down excerpt from a small project I was working on tonight:

...
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"&gt;&lt;/script&gt;
<script type="text/javascript" src="./jquery-ui-personalized-1.6rc6.min.js"></script>
<script type="text/javascript" src="./init.js"></script>
<link rel="stylesheet" href="./css.css" type="text/css" />
<script type="text/javascript">
    $(function() {
        $('#exampleNode').dialog({
            modal: 'true'
        });
    });
</script>
...

For your reference:

The jQuery Dialog Documentation (see the bottom for a styling reference)
A Modal Dialog example
My small MIT licensed project, which has a modal dialog: inComeAgain?

drfloob 2009-02-10 07:55:47

ansaurus

tags:

views:

answers:

open jquery modal dialog on page load

related questions