diff --git a/server.py b/server.py
index 0459248..f2efbad 100755
--- a/server.py
+++ b/server.py
@@ -551,5 +551,17 @@ def getTrendingDisc():
     data = trendings_helper.getTrendingDisc(dateS, dateE)
     return jsonify(data)
 
+@app.route("/_getTypeaheadData")
+def getTypeaheadData():
+    try:
+        dateS = datetime.datetime.fromtimestamp(float(request.args.get('dateS')))
+        dateE = datetime.datetime.fromtimestamp(float(request.args.get('dateE')))
+    except:
+        dateS = datetime.datetime.now() - datetime.timedelta(days=7)
+        dateE = datetime.datetime.now()
+
+    data = trendings_helper.getTypeaheadData(dateS, dateE)
+    return jsonify(data)
+
 if __name__ == '__main__':
     app.run(host='localhost', port=8001, threaded=True)
diff --git a/static/js/trendings.js b/static/js/trendings.js
index e621f7f..ae7b75c 100644
--- a/static/js/trendings.js
+++ b/static/js/trendings.js
@@ -9,6 +9,7 @@ var tagPie = ["#tagPie"];
 var tagLine = ["#tagLine"];
 var sightingLineWidget;
 var discLine = ["#discussionLine"];
+var allData;
 
 /* OPTIONS */
 var datePickerOptions = {
@@ -57,6 +58,51 @@ var pieChartOption = {
         clickable: true
     }
 };
+var typeaheadOption_event = {
+    source: function (query, process) {
+        if (allData === undefined) { // caching
+            return $.getJSON(url_getTypeaheadData, function (data) {
+                    allData = data;
+                    return process(data.TRENDINGS_EVENTS);
+            });
+        } else {
+            return process(allData.TRENDINGS_EVENTS);
+        }
+    },
+    updater: function(theevent) {
+        console.log(theevent);
+    }
+}
+var typeaheadOption_categ = {
+    source: function (query, process) {
+        if (allData  === undefined) { // caching
+            return $.getJSON(url_getTypeaheadData, function (data) {
+                    allData = data;
+                    return process(data.TRENDINGS_CATEGS);
+            });
+        } else {
+            return process(allData.TRENDINGS_CATEGS);
+        }
+    },
+    updater: function(categ) {
+        console.log(categ);
+    }
+}
+var typeaheadOption_tag = {
+    source: function (query, process) {
+        if (allData === undefined) { // caching
+            return $.getJSON(url_getTypeaheadData, function (data) {
+                    allData = data;
+                    return process(data.TRENDINGS_TAGS);
+            });
+        } else {
+            return process(allData.TRENDINGS_TAGS);
+        }
+    },
+    updater: function(tag) {
+        console.log(tag);
+    }
+}
 
 /* FUNCTIONS */
 function innerPieLabelFormatter(label, series) {
@@ -306,7 +352,6 @@ function updateLineForLabel(line, specificLabel, colorMapping, url) {
 function updatePieLine(pie, line, url) {
     $.getJSON( url+"?dateS="+parseInt(dateStart.getTime()/1000)+"&dateE="+parseInt(dateEnd.getTime()/1000), function( data ) {
         var colorMapping = updatePie(pie, line, data, url);
-        console.log(colorMapping);
         updateLine(line, data, undefined, undefined, colorMapping);
     });
 }
@@ -341,6 +386,10 @@ $(document).ready(function () {
     datePickerWidgetEnd.datepicker("setDate", new Date());
     dateEnd = datePickerWidgetEnd.datepicker( "getDate" );
 
+    $('#typeaheadEvent').typeahead(typeaheadOption_event);
+    $('#typeaheadCateg').typeahead(typeaheadOption_categ);
+    $('#typeaheadTag').typeahead(typeaheadOption_tag);
+
     updatePieLine(eventPie, eventLine, url_getTrendingEvent)
     updatePieLine(categPie, categLine, url_getTrendingCateg)
     updatePieLine(tagPie, tagLine, url_getTrendingTag)
diff --git a/templates/trendings.html b/templates/trendings.html
index 4bc9846..2647d0f 100644
--- a/templates/trendings.html
+++ b/templates/trendings.html
@@ -27,6 +27,7 @@
     <script src="{{ url_for('static', filename='js/jquery.flot.time.js') }}"></script>
     <!-- Bootstrap Core JavaScript -->
     <script src="{{ url_for('static', filename='js/bootstrap.js') }}"></script>
+    <script src="{{ url_for('static', filename='js/bootstrap3-typeahead.min.js') }}"></script>
     <link href="{{ url_for('static', filename='css/font-awesome.min.css') }}" rel="text/css">
 
     <link rel="stylesheet" href="{{ url_for('static', filename='css/jquery-jvectormap-2.0.3.css') }}" type="text/css" media="screen"/>
@@ -138,6 +139,7 @@ small {
                             <div class="panel panel-default" style="">
                                 <div class="panel-heading bg-info" style="font-weight: bold;">
                                     <b>Most active events</b>
+                                    <input type="text" id="typeaheadEvent" data-provide="typeahead" size="20" style="margin-bottom: 5px; float:right;" placeholder="Enter an event">
                                 </div>
                                 <div id="panelbody" class="panel-body" style="">
                                     <div id="eventPie" style="width:100%; height: 34vh;"></div>
@@ -150,6 +152,7 @@ small {
                             <div class="panel panel-default" style="">
                                 <div class="panel-heading bg-info" style="font-weight: bold;">
                                     <b>Most active categories</b>
+                                    <input type="text" id="typeaheadCateg" data-provide="typeahead" size="20" style="margin-bottom: 5px; float:right;" placeholder="Enter a category">
                                 </div>
                                 <div id="panelbody" class="panel-body" style="">
                                     <div id="categPie" style="width:100%; height: 34vh;"></div>
@@ -162,6 +165,7 @@ small {
                             <div class="panel panel-default" style="">
                                 <div class="panel-heading bg-info" style="font-weight: bold;">
                                     <b>Most popular tags</b>
+                                    <input type="text" id="typeaheadTag" data-provide="typeahead" size="20" style="margin-bottom: 5px; float:right;" placeholder="Enter a tag">
                                 </div>
                                 <div id="panelbody" class="panel-body" style="">
                                     <div id="tagPie" style="width:100%; height: 34vh;"></div>
@@ -214,6 +218,8 @@ small {
         var url_getTrendingSightings = "{{ url_for('getTrendingSightings') }}";
         var url_getTrendingDisc = "{{ url_for('getTrendingDisc') }}";
 
+        var url_getTypeaheadData = "{{ url_for('getTypeaheadData') }}";
+
         /* DATA FROM CONF */
 
     </script>
diff --git a/trendings_helper.py b/trendings_helper.py
index 2fe4fdf..8d32b14 100644
--- a/trendings_helper.py
+++ b/trendings_helper.py
@@ -71,6 +71,7 @@ class Trendings_helper:
     def getTrendingCategs(self, dateS, dateE):
         return self.getGenericTrending('TRENDINGS_CATEGS', dateS, dateE)
 
+    # FIXME: Construct this when getting data
     def getTrendingTags(self, dateS, dateE, topNum=12):
         to_ret = []
         prev_days = (dateE - dateS).days
@@ -101,3 +102,24 @@ class Trendings_helper:
 
     def getTrendingDisc(self, dateS, dateE):
         return self.getGenericTrending('TRENDINGS_DISC', dateS, dateE)
+
+    def getTypeaheadData(self, dateS, dateE):
+        to_ret = {}
+        for trendingType in ['TRENDINGS_EVENTS', 'TRENDINGS_CATEGS']:
+            allSet = set()
+            prev_days = (dateE - dateS).days
+            for curDate in util.getXPrevDaysSpan(dateE, prev_days):
+                keyname = "{}:{}".format(trendingType, util.getDateStrFormat(curDate))
+                data = self.serv_redis_db.zrange(keyname, 0, -1, desc=True)
+                for elem in data:
+                    allSet.add(elem.decode('utf8'))
+            to_ret[trendingType] = list(allSet)
+        tags = self.getTrendingTags(dateS, dateE)
+        tagSet = set()
+        for item in tags:
+            theDate, tagList = item
+            for tag in tagList:
+                tag = tag[0]
+                tagSet.add(tag['name'])
+        to_ret['TRENDINGS_TAGS'] = list(tagSet)
+        return to_ret