'Is it possible to use `event.target.label` in `html option label` argument value `onChange`?
The value of event.target.value is displayed when outputting it to console.log.event.target.label is not printed.
I want to print the value of label in option , but I am not sure how to do it.
const [value, setValue] = useState<string>("");
const [label, setLabel] = useState<string>("");
const onChangeInteger = (
index: number,
event: React.ChangeEvent<HTMLInputElement>
) => {
if (event.target.name === "IntegerId") {
console.log(event.target.value);
setValue(event.target.value);
}
if (event.target.name === "IntegerText") {
console.log(event.target.label);
setLabel(event.target.label);
}
};
return (
<input
type="text"
list="Lists"
name="IntegerId"
onChange={(event) => onChangeInteger(index, event)}
value={value}
/>
<input
type="text"
list="Lists"
name="IntegerText"
onChange={(event) => onChangeInteger(index, event)}
value={label}
/>
<datalist id="Lists">
<option label="Chocolate" value="1">
<option label="Coconut" value="2">
<option label="Mint" value="3">
<option label="Strawberry" value="4">
<option label="Vanilla" value="5">
</datalist>
)
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
