Autocomplete problem for country and state/province on checkout

pjdietzpjdietz Member
in Bugs & Feature Requests edited November 2012
Hi, FoxyCart team!

I noticed an issue with the autocomplete goodness for the country and state fields on the checkout page not updating properly. The problem is more obvious on touch devices, but I was able to replicate on Chrome on a Mac.

My store is version 0.7.2

On an iPhone (running IOS 5.1.1), I'm able to start typing a country name in #customer_country_name. The menu appears with country names based on the letters I typed, the value of the entire field is updated to contain the full name of the first country in the list, and it selects the characters I did not type. (So far, so good.)

The problem is that if I tap another field or use the "done" or "next" key, the text looks correct, but #customer_country is never updated and the associated functions never get called. For example, if the field was originally "United States", and I replace it with "Canada" and tap to the next field, the country field *looks* correct, but the State/Provence field still provides US states in the menu, and #customer_country still says "US".

There is an additional issue on Android. (I tested in Chrome on a Nexus 7 running 4.1.2.) What I found in addition to the problem above is that the autocomplete fills with with the first country (or state/province) that matches what you have typed so far, but it does not select the auto inserted section. It also treats the auto-inserted characters as though they were typed by the user, so the menu gets updated prematurely. So, a customer who tries to type "Canada" will type "C" and then instantly get "Camboida" with a menu below that only lists "Cambodia" as an option. Backspacing does work correctly, and the menu updates to reflect the new state of the text field after each character is removed.

I was able to get the field to update by triggering the change handler on blur, but this doesn't solve the Android issue. Here's what I added:
$("#customer_country_name, #customer_state_name, #shipping_country_name, #shipping_state_name").bind("blur", function () {
    $(this).trigger("change");
});

Please let me know if you have any suggestions, or if this is something that was resolved with the 1.0 version.

Thanks!
-PJ
Comments
  • lukeluke FoxyCart Team
    Hey PJ. The new 1.0 version is a completely new system, so it is very likely already solved there. Are you able to upgrade and give it a try (and / or create a test store with your specific needs)?

    If you include a link to your store we can take a look also. I'm curious if there might be a JavaScript error interfering with the normal workflow.
Sign In or Register to comment.