AutoComplete

This component does not fully support Flex 4.5 and above. I’m leaving this page up as the component/code may be useful to some developers but I’m no longer actively supporting it.

Advanced Flex AutoComplete component which supports browsing, selecting and ordering multiple items.

Important Info

  • License: The component is freeware. You’re welcome to use it anyway you’d like, I just ask that you send back any bug fixes or improvements.
  • Support: I try as hard as possible to respond to all questions within a day. I’ve been using the component for a while now and am pretty confident that it works well. If you’d like to extend it I’m happy to work with you to get your feature working.

Version History

Other Options

A single solution usually doesn’t work for everyone. Here are some other excellent Flex Autocomplete components which may better fit your needs.

914 thoughts on “AutoComplete”

  2. Hi Hillel , I happened to see the link that you have sent for tips and techniques for proper coding , it was informative and will help in designing software, thanks for sharing this and I have one issue with the autocomplete , is there any way we can replace the text with in the autocomplete which is an object ,Can you please let me know whether we can replace it with text

    Sid

    Reply

  3. Hi Hillel ,

    My requirement is to multiselect from the Autocomplete and we have go button which is responsible for taking the selected values and sending it to the back end and getting the values and sometimes the selected values could be around 10 and its overlapping with the datagrid below and not looking good , so we have decided to reduce the height of the autocomplete to to 19 and again when we click on the autocomplete we have agreed to show again the values selected .

    I tried to set the height to 19 at runtime when we selecte multiple values and hit on go .but the height is not getting changed for some reason and I see that the autocomplete is with in the canvas which has some height specifies , is it not taking the height because of the parent containers explicit height and flex is automatically setting the height of the autocomplete .

    Iam kind of confused on this and one more issue is when we store the previously selected values and apply it to the combo box as combo.selectedItems and when we
    if(commonModelL.selectedItems != null && commonModelL.selectedItems.length!=0 ){
    Combo.selectedItems = commonModelL.selectedItems;

    }
    ombo.showBrowser();

    I would like to show the allready selected items and currently selected item , how do we achieve it .

    Thanks
    Sid

    Reply

      1. Hi Hillel ,

        Issue here is the space , we have this component on a canvas which inturn contains several combo’s , so we have to adjust to multile values by adjusting the height at runtime.

        Sid

      2. You may want to try using the source and overriding the measure and updateDisplayList functions in FlowBox.mxml to better suit your needs.

  4. First of all sorry for my English, I have a problem with the autocomplete am using version 1.2, my problem is when I load my data from the database to a datagrid and then these data the filter with a label which has the auto complete as follows:

    what I get is the following:

    when you click on one of the filter item when I have to put all that I pabrala to cool the dobre datagrig and also when I slide the filter with keys up and down I fill the word in the autocomplete.

    I wanted to see if anyone can help me find a solution since it took days without finding a solution.

    from already thank you very much.

    Reply
  5. Pingback: Flex AutoComplete - jQuery Open Source

  6. Hi Hillel

    Firstly I want to thank you for the great component that you have created.

    Secondly I am facing an issue, I am using _allowEditingSelectedValues option, this means that I can edit the selected item. But when I select the value there is gap between the cursor and the value, though when I use back space it removes only the last alphabet. But there should not be any gap between the value and cursor.

    Eagerly waiting for your reply.

    Reply

  7. Thanks for good stuff,
    I have a question,
    How we handle the item, when it’s removed?
    on Change event, i can get the selecteditem as added item. However noway for removed item.
    Thank you in advance.

    Reply

  8. Great component!

    Just one bug : With Flex 4.6 + theme Wireframe, the component has two borders, they both are still there with borderVisible=false

    Ludo

    Reply

  9. Hi Hillel ,

    I was trying to use facebook style for selectedStyleName ,for some reason iam not getting delete cross hair in the style , is there anything i need to do get that as I need that for the selected option to be deleted

    Thanks
    Sid

    Reply

  10. Hi Hillel,

    I have enabled the clear icon for facebook style still the clear icon is now showing up in the text .Can you please let me know whether there is any issue with styles .

    Sid

    Reply

    1. I’m not aware of any issues with the styles. You can use the code for the demo in the examples folder to check that you’re implementing it the same way.

      Reply

  11. Is there any way to configure the component such that an entered string can be “custom” (i.e. not in the list) but its name match the prefix of one or more items in the list?

    For example, I want to enter “goo” but one of the options in the list is “goober”. Right now, it seems no matter what I do, “goober” would always be what gets selected.

    I realize this may be a bit of an edge case, but it’s one for which I really hope there can be a clean work-around. Thanks.

    Reply

    2. Hi! First, thank you for this wonderful component.
      I have a question.
      Why seems like text property in AutoComplete component always returns an empty string despite it appears correctly into the textinput box?

      _tiNotesBrief.text = “value”;

      trace(“TEXT SET ” + _tiNotesBrief.text);

      last trace printout an empty string =(
      Thanks

      Reply

      1. Text is a read-only property which returns the text of the selected items (ie, “one, two, three”).

        To set the search string which appears in the component you can set the searchText property.

        To set the selected item(s) you want to use either selectedItem, selectedItems or selectedItemIds.

        Hope this helps

      2. i don’t get why i can’t reply to your last post… anyway…

        what if i initialize AutoComplete component with a custom string that’s not any of the ones into the dataProvider list?

        if no changes are made, i guess no selectedItem will be set and i can’t get back my string.

        am i wrong?
        thanks
        Davide

  12. Thanks, Hillel; that does work. I wonder, though, if anyone else might find it useful to have a mode where no item in the drop down is selected by default but instead would require arrowing down or clicking on an item to explicitly select it. I think that might be the more intuitive solution to this particular issue.

    Reply

  13. Great..but really needs to be rewritten for spark. Also api is cluttered…i feel the advanced features need to be broken out into a separate module.

    Reply

  15. Hi Hillel,

    I have a problem regarding the arrow down key not working properly on the dropDownList.

    1. When typing only one or two letters as a searchKey, scrolling the dropdown results is working just fine.
    2. If I input in the searchKey a long string that has no results, then repeating the search done in #1, the list always highlights the first item on the dropdown results.
    (i.e. when pressing the arrow down key, it will move down, but it will immediately return to the first item in the list)

    Please help. Thank you.

    Reply

    1. I’m having trouble replicating the issue. If you could create a sample app demonstrating the issue I’d be happy to help you debug it.

      Reply

  16. Excellent component!
    Request: There should be a https://github.com/hillelcoren with the Autocomplete as an own repo or together with some other of components you may want to share.

    That way it would be much easier for the rest of us to contribute to feature requests such as
    As a user
    I want to have the possibility to always show the dropdown
    So that I don’t have to type to show all my options.

    OC 😉

    Reply

  17. hello,

    i want to use this .swc file in flash Professional CS5.5 but it’s getting some unwanted error so please help me that it is usable in flash professional application.

    Reply

    1. I’m not sure if the component works in Flash Professional, at least I haven’t tried it myself.

      If you could send me the details of the error I can try to help.

      Reply

      1. hi,

        i got this type of error so please tell me how to remove this and which things used insted of this in flash professional

        Error : 1046: Type was not found or was not a compile-time constant: [mx.binding]::IBindingClient.

  19. Hi Hillel Coren.. textinput event is not firing in this component. Can you please help me out?

    whenever im entering any text in this component, test() method is not being called..

    Reply

  20. Hi Hillel,

    We have 60,000 items to appear in the autocomplete and it takes around 1 minute to load the screen. Is there any way, where in which we could reduce this time, Caching / any alternative.

    Thank you
    Ganesh

    Reply

    1. Have you considered implementing a server-side solution. ie, wait for the user to enter the first couple of letters and then load the matching results. You can see an example of how to make this work with the AutoComplete by looking at the DynamicData.mxml application in the examples folder of the download.

      Reply

      1. Thank you for your response. Just looked at the code. we were loading the autocomplete in init() function.

        segpath = serverpath + file;
        segObj.init(segpath,loadseg);

        public function loadseg(grid:ibiObject,obj:*):void {

        segObj.populateGrid(false);
        segAR = segObj.prGrid.source;
        segAC = new ArrayCollection(segAR);

        }

        You are suggesting to load it in the showComboAll function, after the user enters more than 2 characters(from the DynamicData.mxml)

        delayTimer.addEventListener(TimerEvent.TIMER, showComboAll);

        Please let me know, if i was right. In that case, wont it slow down when user types in the data.

        Thank you,

  21. I tried to load the items on search handler function, by doing that it takes 30 seconds every time user enters an alphabet in the autocomplete.

    Earlier by loading in init function, it used to take 30 seconds only at the begining, with the option above. it takes 30 seconds for every alphabet entered. Please let me know, if there are any other options.

    Reply

    1. I assume that when you load the data on init you’re loading all of the data. If the user types a couple of letters you’ll want to filter the data on the server and only return the matching records, this *should* be much quicker. Also you may want to disable the text input while searching, otherwise you need to cancel your request and submit a new one if the user continues to refine their search.

      Reply

      1. Thank you. We tried doing this, but it still hangs for < 5 seconds, while the user types. the user needs to wait few seconds. do we have any other alternative or approach.

      2. Sounds like an improvement… 5 seconds is a long time for data to load though, is it possible for you to optimize the server code. You could also try waiting until the user types more characters or limit the size of the result set. One other suggestion is to use an AMF solution, have you seen James Ward’s Census demo (http://www.jamesward.com/census2/)

  22. Hi, is try to change selectedItemStyleName to underline, but nothing happens.
    It always stays with the standard Style.
    I tried to set it directly
    searchField.setStyle( “selectedItemStyleName”, “underline” );
    and with selectedItemStyleName=”underline”
    I also tried other styles like Facebook and none.
    I even tried to open the swc and change the standard in the default.css to underline. But nothing happens.

    I use Flex 3.5 and autocomplete 1.2.
    My component is:

    Does someone know what is the problem here.

    Greetings

    Reply

    1. Are you using the source or the SWC? If you’re using the source you’ll need to include the default.css style sheet (it’s included automatically when you use the SWC).

      Reply

      2. Can you try including the defaults.css file anyway to see if it helps. Otherwise, if you could email me a sample application which demonstrates the issue I’d be happy to help you debug it.

      3. I got it know, but it isnt perfect.

        I tried to include the defaults.css but it didnt work. I created an example project which worked perfectly. But my project wont. It is a very huge project with nearly 20 flex projects which depend on each other SWC file.
        I tried to load the cssstyledeclaration for AutoComplete with the StyleManager Class. But its result is null. Seems to me that it isnt loaded, but I dont understand why the standard look with the blue border(MacMail) can then be shown.

        Now I copied the css style for underline directly in my
        mxml file with .underline { … }

        That worked.

  23. Hi,

    here for someone who is interested or comes into the same problem.
    My use case for Autocomplete was to develop an autocomplete search over a
    list.
    I have already the list which has a dataprovider and now I used also the autocomplete library for the same dataprovider.
    So when I enter something in the autocomplete search field, the other
    list with the same provider should filter in the same way as the autocomplete field. This worked quite well.
    But there were two behaviours I didnt want.
    When selecting one of the items in the autocomplete drop down, no new filter event was raised. so filtering the list only worked while typing letters in the field, so I needed a possibility to filter one time after I selected one item in the drop down. The next thing was that after selecting a delete of the selected item
    also didnt raise a reset of the list.
    So I programmed a workaround which is not very nice, and hasn`t very logical steps, but it works quite well. But maybe there is a much more simpler solution I didnt found.

    Here is my solution, for people who are interested.

    private function handleChange(event:Event):void {

    var searchFieldText:String = searchField.text;

    var selItem:Object = searchField.selectedItem;
    searchField.selectedItems.removeAll();
    searchField.text = searchFieldText;

    searchField.textInput.setCursorPosition(searchFieldText.length);

    searchField.search();
    searchField.selectedItem = selItem;

    }

    Greetings and thx to Hillel for the library.

    Reply

  24. Hi Hillel,

    Thank you very much for the fantastic tool, it saves me lots of time.

    I was working on auto complete with remote data, and planned to add in a spinner to indicate server communication. But when I checked the code I’m happy to find the spinner component is already in PromptTextInput, but it’s commented out. Just curious why the spinner component is commented out? Is it causing any known issue?

    Cheers.

    Reply

    1. I was planning to include the feature in the 1.2 release but in the end decided against it. I think what bothered me with the implementation was that it would show a line in the debug console each time the component was used. Not a big deal but it may be annoying to users who didn’t use the spinner. I didn’t get a chance to implement a better solution.

      Reply

  25. Hi Hillel,

    Thanks for such a wonderful component, it ranks up there with the best Flex components! I have one question, I am using the Flex-Autocomplete on a DataGrid, how did you capture the change event on the DataGridColumn?

    Thanks a lot.

    Reply

  26. Hi again Hillel,

    I was wondering, is it possible to connect the Flex-Autocomplete directly to a database call on Air (Sqlite database)?

    Thanks.

    Reply

      1. Thanks Hillel,

        Managed to do it, I caught keyUp event on the itemEditor and then I get the item editorInstance which contains the textInput property which is a PromptTextInput.

        I then get the text value of the PromptTextInput which have the value I entered on the itemEditor. Then I call the database synchronously and load the AutoComplete dataProvider with the resulting data. Something like this:

        var dataGrid:DataGrid = event.currentTarget as DataGrid;
        var editedItem:Object = dataGrid.editedItemPosition;
        var editedItemInstance:* = dataGrid.itemEditorInstance;
        var editedItemText:PromptTextInput = editedItemInstance.textInput;

        var result:Array = entityManager.quickFind(editedItemText.text);

        salesInventoryData = new ArrayCollection(result);

        It works beautifully! Thanks man.

  27. Hi Hillel and everyone,

    Just a related question.

    I was using a TextInput itemRenderer and I’ve just find out that it doesn’t capture the ‘enter’ event and the ‘change’ event.

    Can you guys please help me.

    Reply

  28. Hi again Hillel

    I even try to do this to make work the autocomplete disabledItems with the following code but it doesn´t work. Any sugestion?

    In the previous post I put and example of my array collection from the database. I use this array to fill my combos and autocomplete controls. I supposed that if i match my combo dataprovider with the disableditems of autocomplete it should be work but when I try to add some items of that array the first time the autocomplete control add the item causes a duplicate value, not happen the second time because your control i think make some validation when I type the same value again.

    Please could you help me. Or maybe tell me how can i do and implementation a function to disableditems when my autocomplete control is filled with the 100% of the values and then i want to disable some of them.

    Thanks in advance Hillel.

    Example of My Code

    var res:ArrayCollection = new ArrayCollection(mycombo.dataProvider.toArray());
    autocomp1.selectedItems = res;

    var dis:ArrayCollection = new ArrayCollection(mycombo2.dataProvider.toArray());
    autocomp1.disabledItems = dis;

    paraText.validateNow();

    autocomp1.disabledItems = autocomp2.selectedItems;

    Example of My ArrayCollection

    var names:ArrayCollection

    names = new ArrayCollection(
    [
    { “0”:”1.3.1.1.1.1|6″, “1”:”Hugo Varas Valdez Zamudio” },
    { “0”:”1.3.1.1|100″, “1”:”Evelyn Cardenas Ruiz” },
    ] );

    Reply

    1. Thanks for providing more details. I think your best bet is to override the checkIfUnavailable function and define custom logic to control which items appear as disabled.

      Reply

  29. This a great component! 🙂

    However, in order for us to use it, is it possible for you to put the Consts.as class in a package? Because it does not have a package defined, this class is conflicting with an existing class we have in our product (with the same name) which is causing compilation errors.

    Thanks

    Reply

    1. Yeah, sorry about that… it was definitely a mistake. I’d suggest using the source and refactoring the Const.as class to have a different name.

      Reply

  30. Is there a way to have the full dropdown shown as soon as you click inside the box to start typing? For my list I can click in the typing box and hit the spacebar to see all options, but i would like to see all options by just clicking in the box. Is this possible? Or is it possible at least to auto-insert a space any time it is clicked? great component by the way!

    Reply

      1. thanks, i actually used “click” and then made a function for handling the click which used showDropDown. I also had the function use filterData() which seemed to correct a problem i was having with it only displaying the option that was selected if you tried to erase and start over again. for those new to flex like me, you can give your autocomplete an “id” for example ‘id=”autocomp”‘ and then inside the click function you can do “autocomp.” to see the list of function calls possible from the id.

    2. Hi Adam,

      I’m tyring to hit spacebar to see all options in the autocomplete, however can’t seems to get it working.

      Please let me know how do i go about getting this feature in my application.

      Thanks,
      Manav

      Reply

  31. Hi Hittel,

    Thanks for sharing such a great component! 🙂
    I have a question related – is this possible for item selected from list not to become Button and remain a text string inside TextArea? It affects my QTP tests because one time given value becomes Button and the other it is TextArea. Will I have to patch sources?

    Best,
    Przemek

    Reply

      3. Still button inside, now it just looks more like a normal button, but I can’t get rid of it.

      4. I’m sorry, I’m not sure. If you send me a sample application which demonstrates the issue I’d happy to help debug it.

      5. My problem is simple – when typing in AutoComplete I can see sugestions in the dropdown list. When I select item from this dropdown, a button with text on it appears inside AutoComplete. I don’t want this button, just need a simple text inside.
        By changing CSS or selectedItemStyleName property I just change the way that button is drawn, but still – there is a button inside and I don’t want it 🙂
        Is this enough explained?:)

      6. Thanks, I understand now. Sorry… that’s just how the component works. If you set allowEditingSelectedValues to true it will enable the user to modify the values (we replace the Button on the fly with a TextInput). If you wanted to not use a Button you could modify the source code but that would be a pretty big change.

        Hope this helps

      7. Thanks for a quick reply!
        Well, it’s already a big app using extensively your component, so we can’t risk implementing such big changes Thanks anyway for this great component and support 🙂

  32. Hi ,

    I am searching for a solution where I can provide autocomplete and spellcheck with the same component. Is it Possible with this component?

    Jeevan

    Reply

  33. Hi,

    We’re using your component on an important project and it’s implemented via the SWC file.

    2 styling questions:

    1. Is there a way to change the scroll bar skin used in the drop list menu?

    2. Is there a way to modify the hover and selected colors in the drop list menu?

    Thanks,
    Mark

    Reply

      1. Hi Hillel! Need to contact again to report some unwanted thing. I’ve met same problem as Przemek (posts above), when i can’t edit existing items, it just render it as a button. Even setting ‘allowEditingSelectedValues’ to ‘true’ and ‘selectedItemStyleName’ to ‘none’ not change behavior, as i understood there must be textinput shown in these case, but it doesn’t.
        Using Autocomplete v 1.2 for Flex 3.
        Thank in advance!
        Igor

  34. I’ve got a need to have a AutoComplete that when the user clears the text in the box it shows all available. I cant seem to make the component do this. I can in Flex 4 using FlashCOmmanders but cant seem to figure out how to do that here. Any thoughts?

    Reply

    1. You can try adding an event listener for the searchChange event. You can then check if the searchText property is blank and call showDropDown().

      Reply

  35. Hi! I’ve understood why it’s happens, just need to set DataGridColumn (or AdvancedDataGridColumn) ‘editable’ property to ‘true’, otherwise it won’t be edit, as described above.

    Reply

  36. For some reason I have to click the autoComplete control twice in order to start typing. hmmm… I don’t understand what I did to cause this behavior.

    Reply

      1. Thanks. I didn’t see that post earlier. That comment about the setFocus in ‘PromptTextInput.mxml’ worked for me. Odd, the control worked fine with a prompt set in another application. I’m not sure what triggered the behavoir.

        By the way. Thanks for sharing this control. I spent a lot of time with a handful of different mx|spark autocomplete implementations and found this one most useful.

  37. Great Component! We are using it in a huge Flex Application since 2009.
    Today I updated to version 1.2. Now I have some issues with the hightlight.

    It only works on 30% of the items in the dropdownlist. On the other ones the tags are not parsed correctly wich results in “HighlitedPartHere” shown as text in the component. Picutre: http://i47.tinypic.com/2akecqq.png

    I dont know what am I doin wrong. I removed the the highlight on my dropDownLabelFunction and it woks like a charme. But highlightin is a great feature. Does anyone know what am I doin wrong?

    Reply

    1. I’m not sure it will solve your issue but I’ve resolved a different highlighting issue if there are multiple matches. To implement this code replace the highlightMatch function in StringUtils.as with the following:

      public static function highlightMatch( string:String, searchStr:String ):String
      {
      var parts:Array = [];

      for each (var part:String in searchStr.split( ” ” ))
      {
      part = StringUtil.trim( part );

      if (!part)
      {
      continue;
      }

      parts.push( “(” + part + “)” );
      }

      var searchStrPattern:String = parts.join( “|” );
      var regExp:RegExp = new RegExp( searchStrPattern, “igm” );

      return string.replace( regExp, “<b><u>$&</u></b>” );
      }

      Reply

      1. After hours of research I found a solution myself. The problem was a compiler setting forcing the application to use the Flash Text Engine on mx controls. But our application requires FTE components for some text rendering. So the easiest way to solve this issue is to set the textFieldClass property on the DropDownItemRenderer (mx:Label) to “mx.core.UITextField”.

        Hope this clears things up. Thanks again for this great component

  38. Hillel Hello
    Quick question
    (I looked in the documentation and the asDoc and couldn’t find an answer…)
    I have a list of world addresses I wish to filter with the AutoComplete component
    How can I Favor matches in the dataprovider’s array that has the search term in the BEGINNING of the sentence rather then in it’s middle?

    Example:
    When I type “Ba” in the AutoComplete input, the result list would be:
    – Bari. Italy
    – Barcelona, Spain
    – Ulaanbaatar, Mongolia

    This result is correct since my dataprovider array is sorted

    But when I type: “Lo” the result list is:
    – Barcelona, Spain
    – London, UK

    Notice it gave me Barcelona because it contains ‘lo’ but before London…
    This is because my list is sorted according to the first letter…

    So again, the question would be how to favor matches in the beginning of the word over those in the middle of a string…?

    Cheers
    Yariv

    Reply
  39. Pingback: Should my Flex 4 AutoComplete to be renamed as InputAssist? | Train to RIA

  40. I’m having an issue where I need to click the search button twice initially to in order to call the initialize handler and perform the search function ; all subsequent searches can be executed with a single click of the same search button (which is the more favorable behavior for my application). Has anyone experienced such issues using this control?

    thanks in advance,
    abe

    Reply

    1. I believe other people have reported a similar issue. If you could create a sample app which demonstrates the issue I’d be happy to take a look at it.

      Reply

  42. I want an autocomplete, multiselect component and this component can fulfill all my requirement. But for multiselect, if users want to select 4 related items (ex: AA1, AA2, AA3, AA4), he needs to search,choose, search, choose, … 4 times. Is it possible that user can choose several items in one search? Maybe use ctrl+click or use a checkbox.

    Reply

    1. Using the browser you can select multiple items at once but I realize it’s not quite what you’re looking for. You should be able to implement a custom browser (ie, with checkboxes) but it would be a non-trivial task.

      Reply

  43. Hello!

    I’m having a problem using this component in my project. The problem is with the dropdown, it doenst seem to be formatted properly (showing html code) and sometimes even displays wrong values for what is typed.

    This is what it looks like: http://i.imgur.com/BkDeOJS.png

    The problem seems to be in my project, because it works just fine in a new blank project. Have you got any idea what it could be? I already tried removing all the css in my project but it didn’t help.

    Thanks alot and i really hope you canhelp me because I really like this component 🙂

    Greetings
    Philipp

    Reply

    1. I’ve seen this issue before, the highlightMatch function in StringUtils.as was the culprit. It may be worth trying to change/disable highlighting.

      Reply

      2. Can Anyone suggest me the best way to clear the selection ?

        I tried

        subscriptionIdCmb.text=””;
        subscriptionIdCmb.searchText=””;
        subscriptionIdCmb.selectedItem=null;

        Didn’t work.

        Please help me out,Thanks in advance.

  44. Thanks,clear() method works.

    How do I set selectedIndex like we set in combobox.selectedIndex;
    I use selectedItem=object which deosnt get set immedietly

    var object:Object = routeDp.getItemAt(index);
    autoearchR.selectedItem = object;

    if(autoearchR.selectedItem!=null){
    trace(“TRUE”);
    }
    else{
    trace(“FALSE”);
    }

    output

    FALSE

    trace gives false because the autosearchR.selectedItem is null.

    Please advice,thanks in advance.

    Reply

  45. Thanks for such an awesome component!

    I’m using the AutoComplete component as a DataGrid cell editor and it works great. Currently I can set the FlowBox cursor either by using cursor keys or clicking with the mouse. When I begin typing, the cursor moves to the bottom of the list where the item gets added. What I’d like to do is insert the item at the cursor position. Is this possible or can you give me some insight into how best to do this?

    Thanks in advance!

    Reply

    1. I’m sorry, I don’t think there’s an easy way to accomplish that. You’ll probably need to use the source code and will want to modify the addItem function in AutoComplete.mxml. The following line sets the new item’s position (currently at the end).

      flowBox.addChildAt( selectedItem, flowBox.numChildren – 1 );

      Reply

  46. How can I vertically align the text in the search box?
    By default it is in the bottom of the text input box (both the prompt & the input text). Thanks!

    Reply

    1. The AutoComplete component contains a PromptTextInput class which contains a TextInput. You can access the main TextInput using the following syntax.

      autoComplete.textInput.textInput

      Reply

    1. Try calling the filterData function after setting the values in the arraycollection. It will call refresh on the underlying dataprovider which may help.

      Reply

      1. Thanks for the advise, but I am not sure what filterData function you are referring to. Should I call autoComplete3.filterData() after setting the arraycollection?

  48. Hi,
    We use AdvancedAutoComplete component for show our selections. Selections
    can be chosen with tree selection and many of item can be selected. While showing these multiple data(approximately 1000 data), we got “Error #1502: A script has executed for longer than the default timeout period of 15 seconds.
    at mx.core::Container/http://www.adobe.com/2006/flex/mx/internal::getScrollableRect()”

    How can solve this problem?
    Could you help us, please?

    Kadir..

    Reply

    1. It obviously sounds like a performance issue. If you could post the full stacktrace it might help to track down the problem. If you haven’t done so already the profiler may be able to help you find the bottleneck.

      Reply

  49. Hi
    Thank you for all of your insights and help. I have found your posts very helpful.

    I am having trouble changing the font size of the selectedItem when using autocomplete. I am currently using selectedItemStyleName=”none”, but was hoping to make the fontSize align with the font size in the application. Is there a way to do this?

    Thanks!
    Kelly

    Reply

  50. Is it possible to set a field in the browserFields attribute, so it shows the content of a variable of an object that is inside of the object filling my dataprovider?

    for example:
    browserFields=”{ [{ field:’Object.variable’……..

    Reply

    1. I’m sorry, that isn’t currently possible. If you have an array of objects you could create a getter field, otherwise you’d need to use the source to make it work.

      Reply

      1. Ok, thanks for replying anywaw =). It would be a nice and useful functionality for the application I’m developing, since almost all objects have another one inside of them. Thanks again, I’ll try roaming the source.

Leave a reply to Hillel Cancel reply