Material UI – Outlined select label is not rendering properly

Solution 1: Use TextField This is what TextField is for. It uses FormControl and InputLabel internally and make sure they work well together. You can tell TextField to render select instead input by overriding the select props: <TextField value={value} onChange={(e) => setValue(e.target.value)} select // tell TextField to render select label=”Label” > <MenuItem key={1} value=”test”> Test … Read more

HTML: Select multiple as dropdown

A similar question was asked here If you’re able to add an external library to your project, you can try Chosen Here’s a sample: $(“.chosen-select”).chosen({ no_results_text: “Oops, nothing found!” }) <script src=”https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js”></script> <script src=”https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js”></script> <link href=”https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css” rel=”stylesheet”/> <form action=”http://httpbin.org/post” method=”post”> <select data-placeholder=”Begin typing a name to filter…” multiple class=”chosen-select” name=”test”> <option value=””></option> <option>American Black Bear</option> … Read more