jeoQuery UI

GeoNames

jeoQuery by Thomas Haukland

UI plugins

Go on, select a country first... Try viewing the source, the select is populated on load by a geonames call.

Country:

    <select id="country" disabled="disabled">
    </select>

    $("#country").jeoCountrySelect({
        callback: function () {
            $("#country").removeAttr('disabled');
        }
    });

Next, try to input a postal code for this country, and the place should be populated by a geonames service as you leave the input(tab or mouse click elsewhere).

Postal code: Postal place:

    <label for="postalCode">Postal code:
        <input class="input-small" id="postalCode" type="text" />
    </label>
    <label for="postalPlace">Postal place:
        <input id="postalPlace" type="text"/>
    </label>

    $("#postalCode").jeoPostalCodeLookup({
        countryInput: $("#country"),
        target: $("#postalPlace")
    });

City autocomplete (nicked from jquery ui demo):

    <input class="input-large" id="city" type="text"/>

    $("#city").jeoCityAutoComplete();