I have a text area that updates a value in state when it is typed in and displays the new value in the text area. Very simple, and works fine on desktops and android phones, but it doesn't work on iPhone. On iPhone, I type and nothing happens (there's also no cursor).
My textarea
<div>
<h3>Notes</h3>
<textarea name="notes" value={this.state.notes} onChange={(e) => this.handleTextChange(e)}></textarea>
</div>
Function to change value in state
handleTextChange = (e) => {
console.log("triggering handleTextChange...");
this.setState({
[e.target.name]: e.target.value,
changesWereMade: true
});
}
I have also tried various approaches:
<div>
<h3>Notes</h3>
<textarea name="notes" value={this.state.notes} onChange={this.handleTextChange}>{this.state.notes}</textarea>
</div>
<div>
<h3>Notes</h3>
<input name="notes" value={this.state.notes} onChange={this.handleTextChange} /> // this does work on iPhone, but I need a textarea
</div>
<div>
<h3>Notes</h3>
<textarea name="notes" value={this.state.notes} onChange={(e) => this.handleTextChange(e)}></textarea>
</div>
<div>
<h3>Notes</h3>
<textarea name="notes" value={this.state.notes} onChange={(e) => this.handleTextChange(e)}>{this.state.notes}</textarea>
</div>
<form id="noter-save-form" method="POST">
<textarea id="notes-text-area" name="notes" value={this.state.notes} onChange={(e) => this.handleTextChange(e)}></textarea>
<input type="submit" value="Save" />
</form>
EDIT
Also tried the following changes:
Textarea change
<div>
<h3>Notes handleNoteChanged</h3>
<textarea name="notes" value={this.state.notes} onChange={this.handleNoteChanged}>{this.state.notes}</textarea>
<textarea name="notes" value={this.state.notes} onChange={this.handleNoteChanged}></textarea>
</div>
Function to change value in state change
handleNoteChanged = (e) => {
console.log("triggering handleNoteChanged...");
alert(e.target.name, e.target.value);
const name = e.target.name
console.log("name = " + name);
const value = e.target.value
console.log("value = " + value);
this.setState({
notes: value
});
}
Does anyone understand why I can't type in the textarea on iPhone but can on everything else?