Hi,
I try to put a Material-ui TextField as child of (inside) a Material-ui Menu item; here is my code
const ListExampleFolder = React.createClass({
removethisfrequence(){
Frequences.remove(this.props.frequence._id);
},
render() {
return (
<div style={styles.frequences}>
<List subheader="Folders" insetSubheader={true}>
<ListItem
leftAvatar={<Avatar icon={<FileFolder />} />}
rightIcon={
<div>
<IconMenu
iconButtonElement={<IconButton><MoreVertIcon /></IconButton>}
anchorOrigin={{horizontal: 'left', vertical: 'top'}}
targetOrigin={{horizontal: 'left', vertical: 'top'}}
>
<MenuItem primaryText="remove" onClick={this.removethisfrequence} />
<MenuItem>
<form onClick={(e)=>{this.refs.textInpute.focus();}}>
<TextField
hintText="what's up" ref="textInpute" />
</form>
</MenuItem>
</IconMenu>
<Badge
badgeContent={4}
primary={true}
badgeStyle={{top: '-100%', right: '100%'}}
>
</Badge>
</div>
}
// {this.renderTasks()}
primaryText={this.props.frequence.text}
secondaryText="child, school, ..."/>
<Divider inset={true} />
</List>
</div>
);
}
});
export default ListExampleFolder;
All is well except that every time I click on the MenuItem, the menu closes; suddenly I have not the chance to write in the iTextField something to send it.
Is there a way to stop the redirection of Menu item (menu closing) when one click on it; so I can write in the form TextField and send it ?
Thank’s for your help