intl-tel-input

[epexa]

Привет!

Возможно ли использовать вашу библиотеку с International Telephone Input ?

[andr-04]

Привет.

Не пробовал. Но кажется, он просто выводит флаг слева, а само поле ввода не меняется -- т.е. конфликтовать не должно.

Попробуй. Если что-то получится напиши.

[epexa]

@andr-04 Нет, там сложная библиотека работающая с libphonenumber, думаю так просто не получится заставить вашу работать с ней...
Возможно вы бы смогли адаптировать свою... (чтобы с его либы получать формат выбранной страны). Раньше у него была такая возможность, но из-за различных проблем он убрал эту функцию.

[andr-04]

Его плагин, если смотреть на текущее демо, вообще не изменяет маску ввода -- по сути, он только префикс (код страны) меняет. В этой связи мне кажется, что симбиоз с моим плагином всё-таки возможен.

А за libphonenumber спасибо. Что-то никогда не попадалась на глаза, а вещь достойная!

[epexa]

@andr-04 Он взял libphonenumber и реализовал очень удобные вещи!
Посмотрите пример Lookup user's country, National Mode, Validation !
Особенно полезен National Mode, когда номер можно вводить разными вариантами, например РФ:

1. в международном формате, т.е. если россия начинается на +7. Пример: +79126569878.
2. в международном формате без знака +, т.е. если россия начинается на 7. Пример: 79126569878.
3. в обычном формате, т.е. если россия начинается на 8. Пример: 89126569878.
4. в местном формате, т.е. без цифры страны, сразу начиная с кода города. Пример: 9126569878.
   А ещё в любом формате можно использовать скобки и тире. Например в местном формате можно так: (912) 656-98-78.

Какой вариант использовать не важно, всё равно будет автоматически преобразован в международный формат: +7 912 656-98-78

Можно вводить любую страну выбрав просто её в списке или вводить номер в международном формате, страна определится автоматически.

Вообщем библиотека по сути реализовывает так, как сделано в Google регистрации.

Единственного чего не хватает, это автоформатирования при вводе, с 8.0.0 эту функцию убрал((

[epexa]

До ввода:

После:

Выбор страны:

[andr-04]

Да, я посмотрел демо из libphonenumber -- там есть демо "всё в одном", я понял возможности. Выглядит достойно!

Мой же плагин делался как более универсальный, без затачивания под номера телефонов. С учётом такого многообразия вариантов отображения в "привычном" виде несовсем понятно идеологически как это может сочетаться с моим плагином. Т.е. в режиме "международного" номера симбиоз обоих плагинов, кажется, возможен: поведение каждого из них будет видно.

Наверное хорошо было бы увидеть как это было сделано раньше, когда маска телефона ещё была в этом плагине.

[epexa]

@andr-04 Версию 7.1.1 посмотрите.

[noxxer]

Привет!

Тоже ищу возможность реализовать автоформатирование.

Действующая реализация есть в комплексе с коммерческим валидатором:

http://formvalidation.io/examples/validating-international-phone-numbers/

Пока думаю сделать как тут (форматирование ):
jackocnr/intl-tel-input#367 (comment)

Мои эксперименты:
`

Test Int-phone-num

Телефон*

`

var $last_validate = false;
$('#welcomeFormId').find('[name="phone"]')
.intlTelInput({
utilsScript: '/js/utils.js',
preferredCountries: ['ru'],
formatOnInit: true
});
$("#welcomeFormId").find('[name="phone"]').on('keyup', function(){
var telInput = $(this),
value = telInput.val().trim(),
number = telInput.intlTelInput("getNumber"),
isValid = telInput.intlTelInput("isValidNumber"),
res0 = intlTelInputUtils.formatNumber(number),
res1 = intlTelInputUtils.formatNumber(number,telInput.intlTelInput("getSelectedCountryData").iso2),
res2 = intlTelInputUtils.formatNumber(number,null,intlTelInputUtils.numberFormat.INTERNATIONAL),
res3 = intlTelInputUtils.formatNumber(number,telInput.intlTelInput("getSelectedCountryData").iso2,intlTelInputUtils.numberFormat.INTERNATIONAL),
res4 = intlTelInputUtils.formatNumber(number,null,intlTelInputUtils.numberFormat.NATIONAL),
res5 = intlTelInputUtils.formatNumber(number,telInput.intlTelInput("getSelectedCountryData").iso2,intlTelInputUtils.numberFormat.NATIONAL);
console.log('value: ' + value);
console.log('isValid: ' + isValid);
console.log('res0: ' + res0);
console.log('res1: ' + res1);
console.log('res2: ' + res2);
console.log('res3: ' + res3);
console.log('res4: ' + res4);
console.log('res5: ' + res5);
if (isValid || $last_validate) {
telInput.val(res5);
telInput.closest('.form-group').removeClass('has-error').addClass('has-success');
}
else {
telInput.closest('.form-group').removeClass('has-success').addClass('has-error');
}
$last_validate = isValid;
});

Без $last_validate не корректно обрабатывает некоторые коды региона если вводить с 8:
83431112233 (последний знак уже не даст поставить)

Я в frontend не специалист, если удастся сделать лучше - напишите пожалуйста!

[epexa]

@noxxer

Действующая реализация есть в комплексе с коммерческим валидатором:

http://formvalidation.io/examples/validating-international-phone-numbers/

Там просто взят плагин International Telephone Input ниже 8 версии! Вот например в 7.1.1 есть автоформатирование!

@andr-04 Версию 7.1.1 посмотрите.

[randomsuffer]

Так что, получилось объединить с intl-tel-input? Я использую inputmask-multi, но хочу прикрутить слева флажок.

[epexa]

@randomsuffer так и не попробывал. а какой флажок (флаги страны и так же есть) ?

[randomsuffer]

@epexa так флажки же только в intl-tel-input. Я как раз это и хотел объединить. Или в inputmask-multi тоже есть флажки?

[epexa]

@randomsuffer попутал, нету. Если получится объединить, напишите тут.