Ukázka formátování telefonního čísla

Po validaci telefonního čísla, pokud je zadáno správně, dojde k jeho automatickému naformátování po ztrátě fokusu. To platí pro první formulář.

Defaultně je nastaveno chytré formátování, které automaticky vybere způsob formátování podle typů vstupních políček s telefonním číslem. Automatické formátování lze vypnout metodou PhoneControl.setAutomaticFormattingEnabled ( enabled ) nebo upravit způsob formátování metodou PhoneControl.setAutomaticFormattingFormat(  format  ).

Formulář se zapnutým formátováním

Formulář s vypnutým formátováním

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

<form>
   <input class="smartform-instance-1 smartform-phone-number" id="phone" placeholder="Zadejte celé telefonní číslo" required="" type="text" />
   <input class="smartform-instance-2 smartform-phone-number" id="phone" placeholder="Zadejte celé telefonní číslo" required="" type="text" />
</form>

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('smartform');
    }

    /* Zapne zobrazování ikonek a validačních zpráv, a deaktivuje automatické formátování */
    smartform.afterInit = function() {
         smartform.getInstance("smartform-instance-1").phoneControl.setShowValidationStateEnabled(true);
         smartform.getInstance("smartform-instance-1").phoneControl.setShowMessageEnabled(true);
         smartform.getInstance("smartform-instance-2").phoneControl.setShowValidationStateEnabled(true);
         smartform.getInstance("smartform-instance-2").phoneControl.setShowMessageEnabled(true);
         smartform.getInstance("smartform-instance-2").phoneControl.setAutomaticFormattingEnabled(false);
    }

</script>