Using this Ionic code, typing in the input field doesn’t update the state. I can see in the console logs that “CHANGE TRIGGERED” never shows and when I click “Enter” to login it displays the PW as “”. <IonInput label={"Password"} l…

I think the breaking documentation is correct, maybe just not the clearest. I read “such as typing in the input and the input losing focus” that the user has both typed AND the input has lost focus. The bullet point right after does clarify. If your application requires immediate feedback based o…

Create reproducible error in a stackblitz project and post the link.

“Reproduce it on stackblitz” is always the response, but the most recent ionic-react version I can find to fork from is still on v5. And there’s tons of breaking changes from v5 to v7. If someone can provide an updated stackblitz for me to fork from I’ll try to reproduce, but I don’t really have tim…

[image] BLACKSHiRTSQUAD: “Reproduce it on stackblitz” is always the response Reason being is cause more than likely its a user error and not the framework. There are daily endless post about simple things like this one and people don’t like to read docs, just ask questions without researching…

[image] Hills90210: Reason being is cause more than likely its a user error and not the framework. How I wish :sweat_smile: [image] Hills90210: So in order to rule out the framework as the issue, the OP should create a project in stackblitz that can reproduce the error they get. This way…

[image] IONIC REACT v7 - StackBlitz template for ionic framework v7 apps

I wonder if this is related to @ionChange not fired in ionic v7 - #7 by twestrick :thinking: I never created a bug report because I don’t use it so never got around to submitting one.

Could be :thinking: It seems very similar. In that case if I understand it doesn’t fire on de-focus? And here it only fires on de-focus lol. Here is a stackblitz anyways. You can see in the console logs that the IonInput only updates on de-focus, whereas the normal html input updates on every key p…

Per the documentation , you need to use onIonInput to update values of an IonInput as the user types. onIonChange only fires when the element loses focus. This was a breaking change in Ionic v7.

To add, Ionic is following the HTML spec. Per MDN change event : When the element loses focus after its value was changed: for elements where the user’s interaction is typing rather than selection, such as a <textarea> or the text, search, url, tel, email, or password types of the <input> element…

did you try onIonInput? seems to work for me if I understand your issue

IonInput doesn't update state after upgrading to v7

Ionic Framework Ionic React

twestrick August 22, 2023, 5:45pm 7

I wonder if this is related to @ionChange not fired in ionic v7 - #7 by twestrick I never created a bug report because I don’t use it so never got around to submitting one.

Topic		Replies	Views
Issues with state updates after upgrading to Ionic React 7 Ionic React	2	324	January 13, 2024
@ionChange not fired in ionic v7 Ionic Framework	10	6511	April 5, 2023
Ionic Event that Fires when changing the <ion-input>'s value with JavaScript Ionic Framework	1	124	June 6, 2024
Race condition with onIonChange on mobile view only (Ionic 7 React) Ionic React	0	179	March 25, 2024
Ion-input is not updated until the focus ionic-v3	1	1675	July 24, 2017

IonInput doesn't update state after upgrading to v7

Related topics