mpen
mpen

Reputation: 282845

Why is jQuery autocomplete not popping up?

Here's the condensed source code:

<html>
    <head>
        <script type="text/javascript" src="/admin/jsi18n/"></script>
        <link href="/media/css/ui-lightness/jquery-ui-1.8.9.custom.css" type="text/css" media="screen" rel="stylesheet" />
        <script type="text/javascript" src="/media/admin/js/core.js"></script>
        <script type="text/javascript" src="/media/admin/js/admin/RelatedObjectLookups.js"></script>
        <script type="text/javascript" src="/media/admin/js/jquery.min.js"></script>
        <script type="text/javascript" src="/media/admin/js/jquery.init.js"></script>
        <script type="text/javascript" src="/media/admin/js/actions.min.js"></script>
        <script type="text/javascript" src="/media/js/jquery-1.4.4.min.js"></script>
        <script type="text/javascript" src="/media/js/jquery.autocomplete.pack.js"></script>
    </head>
    <body> 
        <div>
            <label for="id_postal_code" class="required">Postal code:</label>
            <input type="text" name="postal_code" id="id_postal_code" />
            <script>$('#id_postal_code').autocomplete({source:['one','two','three']});</script>
        </div>
    </body>
</html>

I'm trying to type 'o' in the textbox, but nothing appears.

It's adding this autocomplete='off' attribute and class='ac_input' to the input, so... it seems to be initializing correctly, I just don't know why anything isn't appearing.

If I look at the source code in firefox, that ac_input flashes every time I hit a key too, so it seems to be setting the class every time I type something, but autocomplete never switches to "on" (which I'm guessing it ought to at some point?).

Upvotes: 1

Views: 1303

Answers (4)

Amy Groshek
Amy Groshek

Reputation: 808

If none of the solutions above or here solve this issue, be sure to check the page markup for a ul.ui-autocomplete element and check the z-index. In my case the plugin was working fine, the element was positioned correctly, but the z-index needed to be bumped up.

Upvotes: 0

Daniel A. White
Daniel A. White

Reputation: 190915

Try replacing {source:['one','two','three']} with ['one','two','three'].

Upvotes: 1

aendra
aendra

Reputation: 5346

You initialize jQuery twice -- admin/jquery.min.js and js/jquery-1.4.4.js

Try fixing that.

Upvotes: 2

Daniel A. White
Daniel A. White

Reputation: 190915

Wrap your call inside

$(function() { 
  // your code here... 
});

It looks like your DOM isn't ready yet.

Upvotes: 2

Related Questions