Open international selector on PhoneNumberInput if user starts typing

Author: jrief

CHANGELOG.md

@@ -6,8 +6,10 @@
     underlying input field is disabled.
   * Fix #251: In `FileUploadWidget`, accept MIME-type is now checked on the client side before
     upoading a file.
-  * Use proper renderer for widget `TelInput` introduced in Django-6.0.
+  * Fix: Use proper renderer for widget `TelInput` introduced in Django-6.0.
   * Fix #256: Set position for widget `PhoneNumberInput` if used with a default country.
+  * Fix: Open international selector for widget `PhoneNumberInput` if used without a default
+    country and user starts typing.
   * Fix: In `Selectize` widget, when using `filter_by`, an empty filter value is now properly
     ignored when loading options lazily.
 

client/django-formset/PhoneNumber.ts

@@ -291,8 +291,12 @@ class PhoneNumberField {
 			this.inputElement.value = '+';
 		} else {
 			this.inputElement.value = this.asYouType.getNumberValue() ?? '';
-			if (isFirst && this.defaultCountryCode) {
-				caretPosition = this.editField.innerText.length;
+			if (isFirst) {
+				if (this.defaultCountryCode) {
+					caretPosition = this.editField.innerText.length;
+				} else {
+					this.openInternationalSelector();
+				}
 			}
 		}
 		this.setCaretPosition(caretPosition);

testapp/forms/phone.py

@@ -15,7 +15,7 @@ class PhoneForm(forms.Form):
     )
     mobile_number = fields.CharField(
         label="Mobile Number",
-        initial='+43 664 1234567',
+        #initial='+43 664 1234567',
         validators=[phone_number_validator],
         widget=PhoneNumberInput(attrs={'default-country-code': 'at', 'mobile-only': True}),
     )