Demo – získání informací o zadané adrese

Každému formuláři můžeme nastavit, z jaké země se budou adresy našeptávat. Nastavení země se provádí metodou SmartformInstance.setCountry().

První formulář používá k zobrazení podrobností o zvalidované adrese validační callback. Druhý formulář využívá skrytá pole, do kterých jsou automaticky vyplněny podrobnosti o adrese. Více informací o skrytých polích zde.

Formulář s validačním callbackem:

 

Formulář se skrytými poli:

 

Zdrojový kód – JavaScript:

<script type="text/javascript" src="https://client.smartform.cz/v2/smartform.js" async></script>
<script type="text/javascript">
   var smartform = smartform || {};
   
   smartform.beforeInit = function () {
       smartform.setClientId('[clientId]');
   }
   
   /* Nastaví validační callback pro první formulář. */
   smartform.afterInit = function() {
       smartform.getInstance('smartform-instance-1').addressControl.addValidationCallback(validationCallback);
   }

   /* Nastaví pro instanci zemi, pro kterou se má našeptávat. */
   function changeCountry(instanceNumber){
       var country = document.getElementById('country_select').value;
       smartform.getInstance('smartform-instance-' + instanceNumber).addressControl.setCountry(country);
   }
 
   /* Validační callback. Pokud je HIT, zobrazí popup s podrobnostmi o adrese. */
   function validationCallback(response) {
         let result = document.querySelector(".result");
         if (result.result.type == smartform.AddressValidationResultType.HIT) {
                printRequestResult(response,response.result.addressArray)
         }
    }
                                                                                                                                                                                        
</script>

Zdrojový kód – HTML pro první formulář:

<form>
   <input class="smartform-instance-1 smartform-address-street-and-number" id="smartform_ulice1" placeholder="Ulice a číslo"  type="text" />
   <input class="smartform-instance-1 smartform-address-city" id="smartform_obec1" placeholder="Obec" type="text" />
   <input class="smartform-instance-1 smartform-address-zip" id="smartform_psc1" placeholder="PSČ" type="text" />
   <select id="country_select" onchange="changeCountry(1)">
      <option selected="selected" value="CZ">Česká republika</option>
      <option value="SK">Slovenská republika</option>
   </select>
   <div class="result"></div>
</form>

Zdrojový kód – HTML pro druhý formulář se skrytými poli:

<form>
   <input class="smartform-instance-2 smartform-address-street-and-number" id="smartform_ulice2" placeholder="Ulice a číslo"  type="text" />
   <input class="smartform-instance-2 smartform-address-city" id="smartform_obec2" placeholder="Obec" type="text" /> 
   <input class="smartform-instance-2 smartform-address-zip" id="smartform_psc2" placeholder="PSČ" type="text" /> 
   <select id="country_select" onchange="changeCountry(2)">
      <option selected="selected" value="CZ">Česká republika</option>
      <option value="SK">Slovenská republika</option> 
   <input class="smartform-instance-2 smartform-address-field-FORMATTED_ADDRESS_WHOLE" name="cela_adresa-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-FORMATTED_ADDRESS_FIRST_LINE" name="prvni_radka-2" type="hidden" />
   <input class="smartform-instance-2 smartform-address-field-FORMATTED_ADDRESS_SECOND_LINE" name="druha_radka-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-DISTRICT" name="okres-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-DISTRICT_CODE" name="okres_kod-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-REGION" name="kraj-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-REGION_CODE" name="kraj_kod-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-CITY" name="mesto-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-CITY_CODE" name="mesto_kod-2" type="hidden" /> 
   <input class="smartform-instance-2 smartform-address-field-POST" name="posta-2" type="hidden" /> 
</form>