diff --git a/lib/modem-dashboard/views/date-selector.html b/lib/modem-dashboard/views/date-selector.html
new file mode 100644
index 0000000..3e8e582
--- /dev/null
+++ b/lib/modem-dashboard/views/date-selector.html
@@ -0,0 +1,18 @@
+<div class="panel panel-default">
+    <div class="panel-body">
+        <form class="form-horizontal">
+            <div class="form-group">
+                <label for="inputDate" class="col-sm-2 control-label">Tanggal:</label>
+                <div class="col-sm-3">
+                    <input type="date" class="form-control" id="inputDate" placeholder="Tanggal" name="inputDate" value="{{ inputDate }}">
+                </div>
+            </div>
+
+            <div class="form-group hidden-print">
+                <div class="col-sm-offset-2 col-sm-10">
+                    <input type="submit" name="submit" value="Submit" class="btn btn-primary">
+                </div>
+            </div>
+        </form>
+    </div>
+</div>
diff --git a/lib/modem-dashboard/views/sms.index.html b/lib/modem-dashboard/views/sms.index.html
index 293d2af..47f2d72 100644
--- a/lib/modem-dashboard/views/sms.index.html
+++ b/lib/modem-dashboard/views/sms.index.html
@@ -8,6 +8,8 @@
 
 {% block content %}
 
+{% include "date-selector.html" %}
+
 <table id="smsHistory" class="display table table-hover table-striped">
     <thead>
         <tr>