diff --git a/README.md b/README.md
index fe00602..573bb68 100644
--- a/README.md
+++ b/README.md
@@ -28,7 +28,8 @@ Laravel Telephone Input component for Blade and Livewire based on the [intl-tel-
- [Usage](#usage)
- [Basic usage](#basic-usage)
- [Add hidden phone-country-input](#add-hidden-phone-country-input)
- - [Usage with Livewire](#usage-with-livewire)
+ - [Usage with Livewire 2](#usage-with-livewire-2)
+ - [Usage with Livewire 3](#usage-with-livewire-3)
- [Sync tel-input wih a country dropdown](#sync-tel-input-wih-a-country-dropdown)
- [Event Listener](#event-listener)
- [Props / Attributes](#props--attributes)
@@ -151,7 +152,7 @@ Please refer to the [intl-tel-input readme](https://github.com/jackocnr/intl-tel
/>
```
-##### Usage with Livewire
+##### Usage with Livewire 2
```html
```
+##### Usage with Livewire 3
+```html
+
+
+```
##### Sync tel-input wih a country dropdown
```html
@@ -246,7 +258,8 @@ input.addEventListener('telchange', function(e) {
$this->showQuickContactForm = !$this->showQuickContactForm;
if ($this->showQuickContactForm) {
- $this->dispatchBrowserEvent('telDOMChanged');
+ $this->dispatchBrowserEvent('telDOMChanged'); // in Livewire 2
+ $this->dispatch('telDOMChanged'); // in Livewire 3
}
}
//...
diff --git a/resources/js/laravel-tel-input.js b/resources/js/laravel-tel-input.js
index 419d5ca..6176ed5 100644
--- a/resources/js/laravel-tel-input.js
+++ b/resources/js/laravel-tel-input.js
@@ -157,7 +157,7 @@
}
}
- // countrychange event function
+ // tel input change event function
const telInputChangeEventFunc = function () {
// phone input data
if (this.dataset.phoneInput) {
@@ -182,6 +182,7 @@
}
if (phoneInput.value !== oldValue && phoneInput.value != '' && (itiPhone.isValidNumber() === true || itiPhone.isValidNumber() === null)) {
phoneInput.dispatchEvent(new KeyboardEvent('change'));
+ phoneInput.dispatchEvent(new KeyboardEvent('input'));
phoneInput.dispatchEvent(new CustomEvent('telchange', {
detail: {
valid: true,
@@ -195,6 +196,7 @@
} else {
if (itiPhone.isValidNumber() === false) {
phoneInput.dispatchEvent(new KeyboardEvent('change'));
+ phoneInput.dispatchEvent(new KeyboardEvent('input'));
phoneInput.dispatchEvent(new CustomEvent('telchange', {
detail: {
valid: false,