Overenie dĺžky tel. čísla

if ( document.querySelector('.checkout') ){
	document.getElementById('billing_phone').addEventListener('change', skontrolujCislo)  // alebo keyup
}

function skontrolujCislo () {
    if(document.getElementById('billing_phone').value.length!=13 ) {
    	document.getElementById('place_order').disabled = true
    }
    else {
	document.getElementById('place_order').disabled = false
    }
}

Tento javascript vypne vo woocomerce tlačídlo odoslať objednávku ak nie je dĺžka telefónneho čísla 13 znakov.

const node = document.createElement("i");
const textnode = document.createTextNode("Telefónne číslo uviest v tvare +421");
node.appendChild(textnode);
document.querySelector('#billing_phone').appendChild(node)

Týmto scriptom zas pridáme element s textom pod input s telefónnym číslom.

Min. alebo max dĺžku tel. čísla však vieme nastaviť aj cez wordpress snippet:

add_filter( 'woocommerce_checkout_fields', 'checkout_fields_custom_attributes', 9999 );
 
function checkout_fields_custom_attributes( $fields ) {
  
  //$fields['billing']['billing_phone']['maxlength'] = 10; // ak by sme chceli nastaviť max. dĺžku staci pridať toto

  //V predvolenom nastavení platobné polia WooCommerce podporujú len niektoré atribúty  napr. maxlenght áno ale minlenght nie takže ho tam treba pridať jedným z týchto spôsobov
 
  //$fields['billing']['billing_phone']['custom_attributes'] = array( "minlength" => "10" ); 
  // $fields['billing']['billing_phone']['custom_attributes']['pattern'] = '.{15,}';   // ak by nefungovali prve 2 moznosti

  $fields['billing']['billing_company']['custom_attributes']['minlength'] = 10;
   return $fields;
}

 Tento snippet síce pridá do pole pokladňa atribút minlenght ale stále sa odosiela, aj keď došlo k chybe pri zadávaní poľa. Takže bez ohľadu na to, čo robíme, aj keď nastavíme atribút minlength , WooCommerce neoveruje vstupnú hodnotu poľa pokladne . Jedinou možnosťou ktorú máme, je zastaviť proces platby, pokiaľ má pole viac ako 10 znakov.

// overí a  vypíše error
add_action( 'woocommerce_checkout_process', 'checkout_fields_phone_validation' );
   
function checkout_fields_phone_validation() { 
   if ( isset( $_POST['billing_phone'] ) && ! empty( $_POST['billing_phone'] ) ) {
      if ( strlen( $_POST['billing_phone'] ) < 10 ) {
         wc_add_notice( 'Min. dĺžka telefónného čísla je 10 znakov.', 'error' );
      }
   }   
}

Dostaneme takýto výsledok:

Viac na: https://www.businessbloomer.com/woocommerce-maxlength-minlength-checkout-fields/