Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to append a button to TextField in Material UI

How can I append a button to a TextField like in bootstrap input group? Bootstrap button append

I tried this, but it is too ugly:

<TextField fullWidth
            variant="outlined"
            label="Add Something"
            InputProps={
                {
                    endAdornment: (
                        <InputAdornment position="end">
                            <Button
                                aria-label="Add"
                                edge="end"
                                color="primary"
                                variant="contained"
                            >
                                ADD
                            </Button>
                        </InputAdornment>
                    )
                }
            }
/>
like image 697
Nodir Nasirov Avatar asked Sep 11 '25 14:09

Nodir Nasirov


1 Answers

<FormGroup row>
  <TextField variant="outlined" placeholder="username" />
  <Button variant="contained" disableElevation>
    @example.com
  </Button>
</FormGroup>

Edit pedantic-pasteur-x8d7b

like image 106
Hamidreza Avatar answered Sep 13 '25 02:09

Hamidreza