Adreso paieška su Postit.lt JS ir API v1.1

Integracijos kodas

Naudokite konkrečią nekintamą bibliotekos versiją ir jai skirtą failo vientisumo patikros (SRI) reikšmę.

Postit.lt JS 1.1.4 naudoja Postit.lt API v1.1

1. Įkelkite biblioteką

<script
    src="/static/postit/1.1.4/postit.min.js"
    integrity="sha384-yatA/SYw9XpqIeSXRNXhfvGTHO+tAa0LFuI3ArO4tjQrQTni9LYCgtRT+BnBlHNn"></script>

2. Naudokite įprastus formos laukus

<label for="shipping-address">Adresas</label>
<input id="shipping-address" name="address" type="text" placeholder="Savanorių pr. 12-34, Vilnius">

<label for="shipping-flat">Buto numeris</label>
<input id="shipping-flat" name="flat" type="text">

<label for="shipping-city">Miestas</label>
<input id="shipping-city" name="city" type="text">

<label for="shipping-municipality">Savivaldybė</label>
<input id="shipping-municipality" name="municipality" type="text">

<label for="shipping-postcode">Pašto kodas</label>
<input id="shipping-postcode" name="postcode" type="text">

3. Įjunkite automatinę paiešką

const postit = Postit.create({
    apiKey: 'YOUR_POSTIT_API_KEY',
    api: { limit: 20, order: 'city_size-desc.city-asc.street-asc.number-asc' }
});

postit.autocomplete({
    input: '#shipping-address',
    flatNumber: '#shipping-flat',
    fields: {
        city: '#shipping-city',
        municipality: '#shipping-municipality',
        post_code: {
            target: '#shipping-postcode',
            transform: value => value ? 'LT-' + value : ''
        }
    }
});

4. Jei reikia, pridėkite paiešką mygtuku

postit.lookup({
    trigger: '#find-postcode',
    sources: {
        address: '#lookup-address',
        city: '#lookup-city'
    },
    query: values => [values.address, values.city]
        .map(value => value.trim())
        .filter(Boolean)
        .join(', '),
    fields: {
        post_code: {
            target: '#lookup-postcode',
            transform: value => value ? 'LT-' + value : ''
        }
    }
});

Pagal numatytuosius nustatymus paieška mygtuku nerodo paieškos vykdymo pranešimo. Jei jo reikia, pridėkite showLoading: true.