Hello all, I need a little help with something. We are trying to set up a form
for entering
address information. We want the user to enter the city name into a text input
field and
then be presented with a list of possible city, state, zip codes to select
from. Once the
select the row from the list it then closes the list and keeps the city name in
the city field
and adds the state and zip info to there fields.
I would LOVE to do this with one of the autocomplete components available but
neither
one willl perform as needed, we have spent a great deal of time trying. So I am
trying to
fool the user into thinking that they are using an autocomplete box. The way I
kind of
have working is:
I created a textinput field called city, when the user types a city in and
tabs out I have an
invisible list field that I turn visible appearing below it that is going out
to the database
looking up that city name and bringing back a list of city, states and zips
that match. But
its not quite working correctly. It is bringing up the list, but the tab order
is sending it to
the next field not the list field like I want. I did make the list field next
in the tabindex
order, but I think the issue is it is not visible until after the cursor has
moved on. Also it
appears the list is appearing before all the data is and it is kind of out of
order and when I
scroll it is messing things up. When I do pick an item it does properly close
the list and
save some data to the fields but it is not the row I picked.
I will include the code for the text input, list and function the lookup
performs to see if
anyone has any suggestions. Thanks in advance.
<mx:TextInput width="159" id="city" tabIndex="3" x="10" y="72"
focusOut="cityLookup
()"/>
<mx:List tabIndex="4" x="10" y="94" width="159" visible="false" height="177"
id="cityPicker" dataProvider="{cityPicklistData}" doubleClickEnabled="true"
doubleClick="citySelect()"></mx:List>
public function cityLookup():void {
if( city.text!="" && city.text.length > 2 ){
srv.url = parentApplication.dataServerURL + "batch";
cityPicker.visible = true;
var infoModel:XML=
<batch>
<query-zipcode.zipcode><city>{city.text}</city></query-
zipcode.zipcode>
</batch>
;
// prepare the request parameters
srv.addEventListener(ResultEvent.RESULT,
// SERVER RESPONSE RECEIVED
function (evt : ResultEvent ):void {
if(srv.lastResult.batch.zipcode != null) {
rawCityPicklistData =
srv.lastResult.batch.zipcode.record;
cityPicklistData = new Array();
for each(var item:Object in
rawCityPicklistData){
cityPicklistData.push({label:item.city+", "+item.state+"
"+item.zipcode, data:item.id});
}
currentState = "cityLookup";
cityPicker.executeBindings(false);
cityPicker.invalidateDisplayList();
}
}
);
srv.addEventListener(IOErrorEvent.IO_ERROR , loadIOError); //
This is an
application global function
//setApplicationBusy();
srv.send(infoModel);
}
}