diff --git a/public/index.html b/public/index.html
index 9b8358b..1719686 100644
--- a/public/index.html
+++ b/public/index.html
@@ -99,20 +99,18 @@
                 <a class="logo-img" href="index.html"><img src="img/app_icon.png" width=45px height=45px></a>
                 <form class="om-searchbar" @submit.prevent="search()">
                     <b-field>
-                        <b-input
-                			type="search"
-                            v-model="searchtext"
-                			icon="magnify"
-                            placeholder="Suche...">
-            			</b-input>
-						<!--<b-autocomplete
-                            v-model="name"
-                            :data="filteredTagArray"
-                			type="search"
-                			icon="magnify"
-                            placeholder="Suche..."
-                			@blur="evaluate">
-            			</b-autocomplete>-->
+						<b-taginput
+							id="search-text"
+							type="search"
+							v-model="selected"
+							:data=taglist
+							autocomplete
+							allow-new:true
+							icon="magnify"
+							placeholder="suche.."
+							@typing="getFilteredTags"
+							@input="saveTagsToArray">
+						</b-taginput>
 					</b-field>
                 </form>
             </div>
@@ -169,6 +167,12 @@
     </div>
 
     <script>
+		var tagArray = [];
+		const data=[
+				'th',
+				'efi',
+				'wichtig',
+    		];
 
         const routes = [
             { path: "/",                component: HomeRouter },
@@ -187,6 +191,8 @@
 			data:  function() {
                 return{
                     searchtext: "ipsum",
+					selected: [],
+					taglist: data,
                 };
     		},
             methods: {
@@ -208,7 +214,27 @@
                     }).fail(function(e, f, g) {
                         console.log("searching: err: " + e + f + g);
                     })
-                }
+                },
+				getFilteredTags(text) {
+					this.taglist = data.filter((option) => {
+					return option
+						.toString()
+						.toLowerCase()
+						.indexOf(text.toLowerCase()) >= 0
+					})
+        		},
+				saveTagsToArray: function() {
+            		tagArray = this.selected;
+            		console.info(tagArray);
+        		},
+				function get_insert_tag(id){
+					$.ajax({ url: "api/tag/"+id, method: "GET" }).done(function (tag) {
+						data.push("#"+tag.name);
+						console.log("it worked!");
+					}).fail(function (e, f, g) {
+						console.log("cannot load " + id + ".json: " + e + f + g);
+					})
+				},
 			},
              mounted: function () {
                 //this.search();