Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: clicking within ion-input on the label triggers (click) twice #30165

Open
3 tasks done
ben-kn-app opened this issue Jan 29, 2025 · 0 comments
Open
3 tasks done

bug: clicking within ion-input on the label triggers (click) twice #30165

ben-kn-app opened this issue Jan 29, 2025 · 0 comments
Labels

Comments

@ben-kn-app
Copy link

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

When you click on an ion-input with attribute (click)="function", this function is called twice when you click on the label within that ion-input. When you click on the value it is called once (as it should).

Expected Behavior

That the function would only be called once when you click on the label within the ion-input

Steps to Reproduce

Stackblitz

  1. Recent ionic & angular
  2. Example:
<ion-list>
  <ion-item>
    <ion-input label="Input with value" value="121 S Pinckney St #300" (click)="clicked()"></ion-input>
  </ion-item>

  <ion-item>
    <ion-input labelPlacement="floating" label="Input with value" value="121 S Pinckney St #300" (click)="clicked()"></ion-input>
  </ion-item>
</ion-list>
  1. Clicking on the label within the ion-input calls the function clicked() twice.

Code Reproduction URL

https://stackblitz.com/edit/ubs56gug?file=src%2Fapp%2Fexample.component.html

Ionic Info

Its ionic from the current stackblitz config used in the docs, from package.json:

"@angular/animations": "^19.0.0",
    "@angular/common": "^19.0.0",
    "@angular/compiler": "^19.0.0",
    "@angular/core": "^19.0.0",
    "@angular/forms": "^19.0.0",
    "@angular/platform-browser": "^19.0.0",
    "@angular/platform-browser-dynamic": "^19.0.0",
    "@angular/router": "^19.0.0",
    "@ionic/angular": "^8.0.0",
    "@ionic/core": "^8.0.0",
    "ionicons": "7.4.0",
    "rxjs": "^7.8.1",
    "tslib": "^2.5.0",
    "zone.js": "~0.15.0"

Additional Information

Adding event.preventDefault(); can be used as a dirty fix untill this issue gets resolved.

@ionitron-bot ionitron-bot bot added the triage label Jan 29, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant