Demo – dva formuláře

Použití dvou formulářů se Smartformem na jedné HTML stránce. Každému formuláři můžeme nastavit, z jaké země se budou adresy našeptávat. Smartform lze použít pro našeptávání adres z těchto zemí:

  • Česká republika
  • Slovenská republika

Adresa zákazníka:

 

Dodací adresa:

 

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]');
   }
   
   smartform.afterInit = function () {
       smartform.getInstance('smartform-instance-zakaznik').addressControl.setCountry('CZ')      
       smartform.getInstance('smartform-instance-dodaci').addressControl.setCountry('CZ')        
   }                                                          
    
   /** Ve formulari nastavi naseptavanou zemi podle hodnoty v combu #country. */

   function changeCountry(instanceType){
       var country = $("#country-"+instanceType).val();
       smartform.getInstance('smartform-instance-'+instanceType).addressControl.setCountry( country );
   }
                                                                                                                                                                                        
</script>

Zdrojový kód – HTML pro adresu zákazníka:

<form>
   <div >
      <div ><label for="smartform_ulice_zakaznik">Ulice a číslo</label> <input class="smartform-instance-zakaznik smartform-address-street-and-number" id="smartform_ulice_zakaznik" type="text" /></div>
      <div ><label for="smartform_obec_zakaznik">Obec</label> <input class="smartform-instance-zakaznik smartform-address-city" id="smartform_obec_zakaznik " type="text" /></div>
      <div><label for="smartform_psc_zakaznik ">PSČ</label> <input class="smartform-instance-zakaznik smartform-address-zip" id="smartform_psc_zakaznik " type="text" /></div>
      <div>
         <label for="country">Země</label> 
         <select id="country" onchange="changeCountry('zakaznik')">
            <option selected="selected" value="CZ">Česká republika</option>
            <option value="SK">Slovenská republika</option>
         </select>
      </div>
   </div>
</form>

Zdrojový kód – HTML pro dodací adresu:

<form>
   <div>
      <div><label for="smartform_ulice_dodaci">Ulice a číslo</label> <input class="smartform-instance-dodaci smartform-address-street-and-number" id="smartform_ulice_dodaci" type="text" /></div>
      <div><label for="smartform_obec_dodaci">Obec</label> <input class="smartform-instance-dodaci smartform-address-city" id="smartform_obec_dodaci" type="text" /></div>
      <div><label for="smartform_psc_dodaci">PSČ</label> <input class="smartform-instance-dodaci smartform-address-zip" id="smartform_psc_dodaci" type="text" /></div>
      <div>
         <label for="country">Země</label> 
         <select id="country" onchange="changeCountry('dodaci')">
            <option selected="selected" value="CZ">Česká republika</option>
            <option value="SK">Slovenská republika</option>
         </select>
      </div>
   </div>
</form>