ansaurus

Question

Answer 1

A:

My guess would be it's not picking up your css file, have you confirmed it actually is?

There's nothing wrong with your code as far as I can tell, the following test works in my sandbox file

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt;
<html>
<!-- Above Doctype should provide S mode in Moz, Safari, Opera, IE8 and A (almost standards) in IE6/7 -->
<head>
  <meta http-equiv="Content-Type" content="application/text+html;utf-8"/>

  <title>Sandbox</title>
  <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

<script type="text/javascript" src="http://www.google.com/jsapi"&gt;&lt;/script&gt;
<script type="text/javascript">
    google.load("jquery", "1.3.2");
    google.load("jqueryui", "1.7.0");
</script>
<script type="text/javascript">

      $(document).ready(function() {
        $("a").click(function(){
            $('#Test').css('display','inline');
            $("#Test").dialog({modal: true});
        });


    });
</script>
</head>
<body>
    <div id="container">
     <a href="#">Test</a>
     <div id="Test" title="Test Title">Bla bla bla</div>
    </div>
</body>

</html>

Steerpike 2009-03-26 13:02:22

Think I've found the issue... I'm using JQuery that ships with Aptana, V1.2.1. Schoolboy error. I've spent 2 freaking days at this.Thanks man.

2009-03-26 13:24:41

Heh, that's why I always serve jquery and the css/ui from external servers when I'm testing :)

Steerpike 2009-03-26 13:52:34

Answer 2

A:

<A> is not a block-level structure, that might be causing some trouble.

Try wrapping it up in a DIV, then make that div in the dialog instead.

Seb 2009-03-26 13:04:19

Answer 3

A:

I had the same problem and it turned out that the CSS file was not being found. Use firebug to load the css file. You might find that what shows up in Firebug is a "404 Not found".

Karim 2009-03-26 13:04:21

Answer 4

A:

Found the answer - was using an old version of jQuery. Thanks for your help.

2009-03-26 14:16:20

Answer 5

A:

You might want to add to the click is e.preventDefault(); so it doesn't try to load the # which may refresh the page.

    $("a").click(function(e){
        e.preventDefault();
        $('#Test').css('display','inline');
        $("#Test").dialog({modal: true});
    });

joelpittet 2009-03-27 06:11:10

ansaurus

tags:

views:

answers:

Help with jQuery UI dialog

related questions