Demo – upravený text v našeptávači

Ukázka možnosti změnit text v našeptávači adres.

Využívá dvou funkcí, které lze nastavit ve Smartform API:

 

Prohození obce a PSČ při našeptávání celé adresy:

Při našeptávání celé adresy v našeptávači u políčka „ulice a číslo“ je adresa standardně ve formátu „ulice a číslo, PSČ obec“. V následujícím formuláři je PSČ a obec v našeptávači prohozená.

 

Prohození obce a PSČ při našeptávání a při vyplnění celé adresy do políčka:

Při našeptávání celé adresy v našeptávači u políčka „ulice a číslo“ je adresa standardně ve formátu „ulice a číslo, PSČ obec“. V následujícím formuláři je PSČ a obec v našeptávači prohozená. Prohozená adresa se také vyplní do textového políčka.

 

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() {
        // na první instanci prohodíme PSČ a obec v textu našeptávače
        smartform.getInstance( "smartform-instance-1" ).addressControl.setSuggestionFormatter( swapCityZipSuggestionFormatter );
      
         // na druhé instanci prohodíme PSČ a obec v textu našeptávače
        smartform.getInstance( "smartform-instance-2" ).addressControl.setSuggestionFormatter( swapCityZipSuggestionFormatter );
        // na druhé instanci po výběru řádku v našeptávači vyplníme do políčka zformátovanou adresu, kde také prohodíme PSČ a obec
        smartform.getInstance( "smartform-instance-2" ).addressControl.setSelectionCallback( wholeAddressSelectionCallback );
    }

   
    /* Formátuje celou adresu pro našeptávač. Prohazuje pořadí obce a PSČ. */
    function swapCityZipSuggestionFormatter( suggestion, fieldType ){
        if ( suggestion.isWholeAddress() ) {
            return suggestion.getValue("smartform-address-street-and-number") + ", " + suggestion.getValue("smartform-address-city") + ", " + suggestion.getValue("smartform-address-zip");
        }
        return null; // pouzije se defaultni format
    }


    /* Když uživatel vybere řádek v našeptávači, do políčka "celá adresa" se dostane zformátovaná adresa z našeptávače. */
    function wholeAddressSelectionCallback(element, text, fieldType, suggestion){
        if( suggestion.isWholeAddress() && fieldType=="smartform-address-whole-address" ) {
            element.value = suggestion.getValue("smartform-address-street-and-number") + ", " + suggestion.getValue("smartform-address-city") + ", " + suggestion.getValue("smartform-address-zip");
            return false;
        } 
        else
            return true;  // pouzije se defaultni hodnota
    }
                                                                                                                                                                                   
</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" />
</form>

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

<form>
   <input class="smartform-instance-2 smartform-address-whole-address" id="adresa" type="text" />
</form>