Hi In our project we are using react material Ui. We are using select and transfer list function in our Ui. We have condition that after changing Select value in dropdown right side of the tranfer list should prepopulate. Currently functionality wise it is working but when I try to print it is taking past prepopulated value for the transfer list. Below is my code.Can someone please help me? Let me know If I need to add any other details
<InputLabel id="demo-simple-select-label">Rank</InputLabel>
<Select labelId="demo-simple-select-label" id="demo-simple-select" value={roles}
onChange={onRankChange}>
<MenuItem value="one">one</MenuItem>
<MenuItem value="two">two</MenuItem>
<MenuItem value="three">three</MenuItem>
<MenuItem value="four">four</MenuItem>
</Select>
const [ranks, setRanks] = useState("");
const onRankChange = (event: React.ChangeEvent<{ value: unknown}>) => {
console.log('inside role change');
if(event.target.value === "one"){
setRanks(event.target.value as string);
setLeft(["test","test1","test2"]);
setRight(["test3","test4"]);
}
else if(event.target.value === "two"){
setRanks(event.target.value as string);
setLeft(["test3","test4"]);
setRight( ["test","test1","test2"]);
}
else if(event.target.value === "three"){
setRanks(event.target.value as string);
setLeft( []);
setRight( ["test","test1","test2","test3","test4"]);
}
else if(event.target.value === "four"){
setRanks(event.target.value as string);
setLeft(["test","test1","test2","test3","test4"]);
setRight( []);
}
console.log('roles####' +event.target.value);
console.log('leftChecked###' + left);
console.log('rightChecked####' + right);
}
New contributor
Pgs is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.