Example of using material-select multiple in the demo #143

krescruz · Apr 20, 2016 · f6386e8 · f6386e8
1 parent 8def636
commit f6386e8
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 2 deletions.
diff --git a/index.html b/index.html
@@ -273,7 +273,7 @@ <h2 class="header">Material select</h2>
                     <option ng-repeat="value in select.choices">{{value}}</option>
                 </select>
             </div>
-            <div class="section col s4">
+            <div class="section col s8">
                 <h5>You selected: <b>{{select.value1}}</b></h5>
             </div>
         </div>
@@ -283,14 +283,34 @@ <h5>You selected: <b>{{select.value1}}</b></h5>
     &lt;option ng-repeat="value in select.choices"&gt;{{value}}&lt;/option&gt;
 &lt;/select&gt;</code></pre>
         </div>
+
+        <div class="row">
+            <h5>Multiple select</h5>
+            <div class="section col s4">
+                <select class="" ng-model="select.value3" material-select multiple watch>
+                    <option ng-repeat="value in select.choices">{{value}}</option>
+                </select>
+            </div>
+            <div class="section col s8">
+                <h5>You selected: <b>{{select.value3}}</b></h5>
+            </div>
+        </div>
+        <div class="row">
+<pre><code class="language-markup" ng-non-bindable>
+&lt;select class="" ng-model="select.value3" material-select multiple watch&gt;
+    &lt;option ng-repeat="value in select.choices"&gt;{{value}}&lt;/option&gt;
+&lt;/select&gt;</code></pre>
+        </div>
+
+
         <div class="row">
             <h5>Using class browser-default</h5>
             <div class="section col s4">
                 <select class="browser-default" ng-model="select.value2">
                     <option ng-repeat="value in select.choices">{{value}}</option>
                 </select>
             </div>
-            <div class="section col s4">
+            <div class="section col s8">
                 <h5>You selected: <b>{{select.value2}}</b></h5>
             </div>
         </div>

diff --git a/js/app.js b/js/app.js
@@ -3,6 +3,7 @@ var app = angular.module('materializeApp', ['ui.materialize'])
         $scope.select = {
             value1: "Option1",
             value2: "I'm an option",
+            value3: ["Option1", "I'm an option"],
             choices: ["Option1", "I'm an option", "This is materialize", "No, this is Patrick."]
         };