Autocomplete in Flex 4.0 not displaying items in dropdown list

Question

Hi, I am new to flex, actionscript and flash builder (having to do an upgrade to an existing project).

One of the problems I seem to have is that the Autocomplete component that seems to be part of flex extras is not displaying the list of items in the dropdown list. Basically, I get a list of blank items. I know they are there and they are the right items because as soon as I click on one, I get the right text in the combobox.

my Code in the mxml looks something like this

<mx:FormItem label="Company:" width="750" fontSize="20" horizontalAlign="right" color="#000000" required="true">
    <ns1:AutoComplete enabled="true" labelField="CompanyName" textAlign="left" dropdownWidth="450" id="txtCompany" width="450"  />
</mx:FormItem>

In the actionscript when the form loads, as part of the initialization a webservice call is made and the results from that call are set as the dataprovider for the above AutoComplete box like so

public function handleGetCompanyResult(event:ResultEvent):void{
    txtCompany.dataProvider = event.result;
}

As I said, when I type a letter in the text box, I see a dropdownlist with a scroll bar on the left but it looks empty. When I click on one of the items, I see the associated company name in the text box. When I set a breakpoint the event.result is an ArrayCollection of proxyObjects.

I tried to change it and put some dummy data like so

public function handleGetCompanyResult(event:ResultEvent):void{
            var companyList:ArrayCollection = ArrayCollection(event.result);
            var displayCompanyList:ArrayCollection = new ArrayCollection();

            displayCompanyList.addItem({CompanyName:"Test1"});
            displayCompanyList.addItem({CompanyName:"Test2"});
            displayCompanyList.addItem({CompanyName:"Test3"});

            txtCompany.dataProvider = displayCompanyList;
}

Again, when I type "T" in the text box I see a dropdown list with 3 empty items. Clicking on the third item puts "Test3" in the textbox. But the items themselves are not visible.

It almost as if its a font/foreground color thing, but I've played around with some of those settings too with no success.

Any help would be much appreciated.

Answer 1

Ok, turns out the project was a Flex 3 project that was imported into Flex 4. It works where it does and breaks down where it doesn't. I created a simple Flex 4 project with an alert box and it worked. I slowly moved all my code across to this project and it worked. It gave me a warning about the styles tag about not being able to use or something like that. I just removed all of the style tags and it worked fine. It doesn't look the same, so I have to fiddle with it a bit more, but at least the text showed up. So something to do with the themes and the Flashbuilder compiler using them at compile time.

All I have to say is what a crappy tool. If the import didn't work, it should have failed completely ages ago. I searched and searched for any projects files or code files that were related to css or styles or themes. But clearly it was using something that was independent of my project to control some tiny part(s) of my project. The parameters of controls in my project were essentially dependent on some environmental/ide factors. What a pain to debug.