--- a/viewcalls.php
+++ b/viewcalls.php
@@ -12,6 +12,13 @@
 }
 
 ?>
+<form class="form-horizontal">
+    <fieldset>
+        <div class="input-prepend">
+            <span class="add-on"><i class="icon-calendar"></i></span><input type="text" name="range" id="range" />
+        </div>
+    </fieldset>
+</form>
 <div class="span12">
 
     <table width="100%" height="775px">
@@ -67,6 +74,76 @@
             });
 
 
+            // Set the default dates
+            var startDate	= Date.create().addDays(-6),	// 7 days ago
+                endDate		= Date.create(); 				// today
+
+            var range = $('#range');
+
+            // Show the dates in the range input
+            range.val(startDate.format('{MM}/{dd}/{yyyy}') + ' - ' + endDate.format('{MM}/{dd}/{yyyy}'));
+
+            range.daterangepicker({
+
+                startDate: startDate,
+                endDate: endDate,
+
+                ranges: {
+                    'Today': ['today', 'today'],
+                    'Yesterday': ['yesterday', 'yesterday'],
+                    'Last 7 Days': [Date.create().addDays(-6), 'today'],
+                    'Last 30 Days': [Date.create().addDays(-29), 'today']
+                }
+            },function(start, end){
+
+                ajaxLoadChart(start, end);
+
+            });
+            function ajaxLoadChart(startDate,endDate) {
+
+                // If no data is passed (the chart was cleared)
+
+                if(!startDate || !endDate){
+                    chart.setData({
+                        "xScale" : "time",
+                        "yScale" : "linear",
+                        "main" : [{
+                            className : ".stats",
+                            data : []
+                        }]
+                    });
+
+                    return;
+                }
+
+                // Otherwise, issue an AJAX request
+
+                $.getJSON('ajax.php', {
+
+                    start:	startDate.format('{yyyy}-{MM}-{dd}'),
+                    end:	endDate.format('{yyyy}-{MM}-{dd}')
+
+                }, function(data) {
+
+                    var set = [];
+                    $.each(data, function() {
+                        set.push({
+                            x : this.label,
+                            y : parseInt(this.value, 10)
+                        });
+                    });
+
+                    chart.setData({
+                        "xScale" : "time",
+                        "yScale" : "linear",
+                        "main" : [{
+                            className : ".stats",
+                            data : set
+                        }]
+                    });
+
+                });
+            }
             getData('<?php echo $tgid; ?>', '<?php echo $from ?>', '<?php echo $to ?>');
 
         });