SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Apr 2008
    Location
    Sweden
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Get what you typing as first result item with jQuery autocomplete?

    I try to create a interactive tags field with jQuery autocomplete. But stuck at a functionality that I did not manage to create. What I want to create are:

    As soon as you start typing in the tags field, the first item that comes up will be the text you are writing. So when you press enter, that will be selected.

    I have attached a image that illustrates this. How do you achieve this?

    autocomplete.jpg

    My code right now:

    Code:
    $(document).ready(function()
    {
    	$("#filter-field").autocomplete('/search.php',
    	{
    	width			: 290,
    	multiple		: false,
    	matchContains	: true,
    	formatItem 		: function(data)
    					  {
    					  return data[0];
    					  },
    	});
    });

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    From the documentation it has an event called open, in which you could make use of a method that it has to set one of the options.
    http://jqueryui.com/demos/autocomplete/
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2008
    Location
    Sweden
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I can't get even the simplest "open"-thing to work:

    Code:
    $(document).ready(function()
    {
    	$("#filter-field").autocomplete('/search.php',
    	{
    	width			: 290,
    	multiple		: true,
    	matchContains	: true,
    	autoFocus		: false, // The first item will be automatically focused
    	formatItem 		: function(data)
    					  {
    					  return data[0]
    					  },
    	open 			: function(event, ui) { alert("hej"); }
    	});
    });
    What's wrong?


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •