(click) event doesn't work, while input element is focused

@dLesjak wrote:

Hi there,
I am building PWA.
I have two tabs page and on the bottom of one tab I have input for a chat messages. It is placed in ion-footer. I have a problem that while the input is focused (click) event on the button doesn’t trigger. So basically I have to click twice, first click to unfocus and second to post the message. I tried with ion-item and textarea with button separated in the ion-grid.
It seems that the same input with button works if I place it into ion-content

The most confusing thing is, that if I click on ion-card which opens modal and it is placed in ion-content, it works at first click even if input is focused.

version: “ionic-angular”: “3.9.2”

<ion-footer [class.keyboardOpenFooter]="keyboard.isOpen()">
  <ion-toolbar>
      <ion-item *ngIf="loggedIn==true && activeGame!= undefined">
          <ion-input rows="1" placeholder="Message"  [(ngModel)]="message"></ion-input>
          <button ion-button icon-only clear item-right (click)="postMessage()" color="primary">
                <ion-icon  name="send"></ion-icon>
           </button>
      </ion-item>
     
      
      <!-- same behavior
      <ion-grid>
        <ion-row>
          <ion-col>
            <textarea class="text-input" rows="1" placeholder="Message"  [(ngModel)]="message 
            </textarea>
          </ion-col>
          <ion-col>
             <button ion-button icon-only clear (click)="postMessage()"  color="primary"><ion-icon  
          name="send"></ion-icon></button>
          </ion-col>
        </ion-row>
      </ion-grid>-->
  
    <span *ngIf="loggedIn==false">Za komentiranje se je potrebno prijaviti.</span>
  </ion-toolbar>
</ion-footer>

Looks like this:

Any ideas? Thank you!!!

Posts: 1

Participants: 1

Read full topic