Nativescript: iOS: TextView hint becomes text

[eleddie]

I have a text view which has a hint, when I start typing, the hint disappears (as it should) and I type like normal text. But when I send the message (is a chat app) and set the ngModel var back to "" again, the hint now becomes editable text and I start typing in gray color like hint.

Here's the problem:

[NickIliev]

Hi @eleddie

I've tried to reproduce your case but to no avail! I've tested it with this sample (with some modifications) but still was not able to reproduce so perhaps you can share with us a code snippet or a sample project which can recreate this scenario.

[eleddie]

I would like this issue to be reopened since it isn't fixed yet. I was o a vacation trip and I couldn't reply. I'm going to create a sample project today so you could try it.
Thanks

[Daxito]

I also used to have this issue, I fixed it by removing the hint!!!

[NickIliev]

@eleddie, @Daxito can you post a snippet or a link to sample project reproducing the described case?

[eleddie]

Hello @NickIliev, sorry for the delay, I've been kinda busy.

This is my html:

<TextView col="0" hint="Type a message..." [(ngModel)]="typing" returnKeyType="done" class="background-write"></TextView>
<Button col="1" text="&#xE163;" class="mi" (tap)="sendMessage(typing)"></Button>

and ts:

 private sendMessage(message: string) {
       if (message == "") return;
       this.typing = "";
       var newMessage = new Message(message.trim());
       this.messages.push(newMessage);
}

As @Daxito said, I can't just remove the hint...

[NickIliev]

@eleddie I was able to reproduce your case and marked is as a bug. We will investigate further and post additional info when we have a solution.

Code to reproduce this issue here

Meanwhile as a workaround, you can reset your hint after the initial text value is send. This way you will still have initial hint.
Example:

import { Component } from "@angular/core";

@Component({
    selector: "my-app",
    templateUrl: "app.component.html",
})

export class AppComponent {
    public typing: string = "";
    public hint: string = "Type a message... ";

    public sendMessage(message: string) {
        if (message == "") {
            return;
        }
        this.hint = "";
        this.typing  = "";
    }
}

<StackLayout class="p-20">
    <TextView #tv [(ngModel)]="typing" [hint]="hint" returnKeyType="done"></TextView>
    <Button text="TAP" class="mi" (tap)="sendMessage(tv.text)"></Button>
</StackLayout>

[eleddie]

Great! Thanks @NickIliev I'll be waiting for it to be fixed

[ickata]

Hi, any update here?

[tsonevn]

This is still reproducible with tns-core-modules 3.0 and @next.
For now, you could use the workaround suggested by @NickIliev in its comment.

[ickata]

The problem with @NickIliev's workaround is the fact that the hint is never restored when the TextView looses focus. Still, I agree that this is a proper workaround, having in mind that the user is not that stupid to forget that this white box is a text area :) Anyway, it will be great if you guys fix this :)

[SvetoslavTsenov]

The fix is already available in tns-core-modules@next and will also be released with [email protected]

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.