Added demo for Dynamic Loading Autocomplete.

Author: kevzlou7979

src/main/java/gwt/material/design/demo/client/application/addins/autocomplete/AutoCompleteView.java

@@ -49,7 +49,7 @@ interface Binder extends UiBinder<Widget, AutoCompleteView> {
     }
 
     @UiField
-    MaterialAutoComplete acList, acListType, acListLimit, acModal, acValue;
+    MaterialAutoComplete acList, acListType, acListLimit, acModal, acValue, acDynamic;
 
     @UiField
     MaterialModal modal;
@@ -77,15 +77,26 @@ public void onSelection(SelectionEvent<SuggestOracle.Suggestion> event) {
                 MaterialToast.fireToast("Value : " + user.getDisplayString());
             }
         });
+        acDynamic.addValueChangeHandler(event -> {
+            for(SuggestOracle.Suggestion user : event.getValue()){
+                MaterialToast.fireToast("Value : " + user.getDisplayString());
+            }
+        });
         acListType.setSuggestions(oracle);
         acListLimit.setSuggestions(oracle);
         acModal.setSuggestions(oracle);
 
-        acListType.addValueChangeHandler(valueChangeEvent -> {
-            MaterialToast.fireToast("Value: " + valueChangeEvent.getValue().get(0).getDisplayString());
+        acListType.addValueChangeHandler(event -> {
+            MaterialToast.fireToast("Value : " + acListType.getItemBox().getText());
         });
     }
 
+    @UiHandler("loadSuggestions")
+    void loadSuggestions(ClickEvent e) {
+        UserOracle oracle = new UserOracle();
+        oracle.addContacts(getAllUsers());
+        acDynamic.setSuggestions(oracle);
+    }
 
     @UiHandler("btnClear")
     void onClear(ClickEvent e) {

src/main/java/gwt/material/design/demo/client/application/addins/autocomplete/AutoCompleteView.ui.xml

@@ -167,6 +167,26 @@
                 acListType.setItemValues(itemValues, true);
             </demo:PrettyPre>
         </m:MaterialRow>
+
+        <m:MaterialRow addStyleNames="code">
+            <m:MaterialTitle title="Dynamic Loading" description="You can load your data dynamically by calling autocomplete.setSuggestions(suggestions)"/>
+            <m:MaterialRow>
+                <m:MaterialColumn grid="s12 m12 l6">
+                    <ma:autocomplete.MaterialAutoComplete ui:field="acDynamic" placeholder="Contacts" grid="s12"/>
+                </m:MaterialColumn>
+                <m:MaterialColumn grid="s12">
+                    <m:MaterialButton text="Load Suggestions" ui:field="loadSuggestions"/>
+                </m:MaterialColumn>
+            </m:MaterialRow>
+            <demo:PrettyPre addStyleNames="lang-java">
+                &emsp;@UiHandler("loadSuggestions") <br/>
+                void loadSuggestions(ClickEvent e) { <br/>
+                &emsp;UserOracle oracle = new UserOracle(); <br/>
+                &emsp;oracle.addContacts(getAllUsers()); <br/>
+                &emsp;autocomplete.setSuggestions(oracle); <br/>
+                }
+            </demo:PrettyPre>
+        </m:MaterialRow>
 
         <m:MaterialRow addStyleNames="code">
             <m:MaterialTitle title="Limiting Items" description="You can limit the autocomplete items by adding limit='2' attribute."/>