Problem when using Select

Question

Problem when using Select

Navigation

#1 by (5 votes)

4

I'm trying to use form select of this site here:
link

But when I put on my site the only thing that appears is this:

"Materialize Multiple Select"

Does anyone know how to solve this?

The code is this:

<div class="input-field col s12">
    <select multiple>
      <option value="" disabled selected>Choose your option</option>
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
      <option value="3">Option 3</option>
    </select>
    <label>Materialize Multiple Select</label>
  </div>

select materialize

asked by anonymous 19.01.2016 / 13:29

1 answer

Query with Many-to-Many Relationship Entity Framework How to make a progress bar with steps?

score 5 · Accepted Answer

It may be missing some file. Add how you referenced them in your html . Remember that you need to "start" material_select() , like this:

$(document).ready(function() {
    $('select').material_select();
});

A working example of select is below:

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.4.js"></script><style type="text/css"></style>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css">    
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js"></script><scripttype="text/javascript">//<![CDATA[
window.onload=function(){
$(document).ready(function() {
    $('select').material_select();
});
}//]]> 

</script>
<div class="input-field col s12">
    <select multiple>
      <option value="" disabled selected>Choose your option</option>
      <option value="1">Option 1</option>
      <option value="2">Option 2</option>
      <option value="3">Option 3</option>
    </select>
    <label>Materialize Multiple Select</label>
  </div>

The same can be seen in JSFiddle.

Related: Materialize CSS - Select Does not Seem to Render