Hi rani,

For Date selection i have used jQuery UI Datepicker.

Check this example. Now please take its reference and correct your code.

Database

For this example I have used of Northwind database that you can download using the link given below.

Download Northwind Database

Namespaces

using System.Collections.Generic;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Linq;

Controller

public class HomeController : Controller
{
    // GET: /Home/
    public ActionResult Index()
    {
        return View();
    }
    [HttpPost]
    public JsonResult GetChartData(string date)
    {
        string query = "SELECT ShipCountry, DATEPART(Year, OrderDate) [Year], COUNT(OrderId) [Total]";
        query += " FROM Orders WHERE ShipCountry IN ('USA', 'France', 'Brazil', 'Canada') AND (OrderDate >= @Date OR @Date IS NULL)";
        query += " GROUP BY ShipCountry, DATEPART(Year, OrderDate)";

        string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
        DataTable dt = new DataTable();
        using (SqlConnection con = new SqlConnection(constr))
        {
            using (SqlCommand cmd = new SqlCommand())
            {
                cmd.CommandText = query;
                cmd.CommandType = CommandType.Text;
                cmd.Connection = con;
                cmd.Parameters.AddWithValue("@Date", !string.IsNullOrEmpty(date) ? date : (object)DBNull.Value);
                using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
                {
                    sda.Fill(dt);
                }
            }
        }

        List<string> countries = (from p in dt.AsEnumerable()
                                    select Convert.ToString(p["ShipCountry"])).Distinct().ToList();

        List<int> years = (from p in dt.AsEnumerable()
                            select Convert.ToInt32(p["Year"])).Distinct().ToList();

        ChartData chartData = new ChartData();
        chartData.Category = years.ToArray();
        List<Series> ser = new List<Series>();
        foreach (string country in countries)
        {
            Series series = new Series();
            List<int> data = new List<int>();
            foreach (int year in years)
            {
                int total = (from p in dt.AsEnumerable()
                                where Convert.ToInt32(p["Year"]) == year && p["ShipCountry"].ToString() == country.Trim()
                                select Convert.ToInt32(p["Total"])).FirstOrDefault();

                data.Add(total);
            }
            series.name = country;
            series.data = data.ToArray();
            ser.Add(series);
        }
        chartData.Series = ser;
        return Json(chartData);
    }

    public class ChartData
    {
        public int[] Category { get; set; }
        public List<Series> Series { get; set; }
    }

    public class Series
    {
        public string name { get; set; }
        public int[] data { get; set; }
    }
}

View

<div ng-app="MyApp" ng-controller="MyController">
    <input type="text" ng-model="date" jqdatepicker />
    <hr />
    <div id="chart">
    </div>
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="https://code.angularjs.org/1.3.0/angular.js"></script>
<script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script>
<script type="text/javascript">
    var app = angular.module('MyApp', [])
    app.directive('jqdatepicker', function () {
        return {
            restrict: 'A',
            require: 'ngModel',
            link: function (scope, element, attrs, ngModelCtrl) {
                element.datepicker({
                    dateFormat: 'mm/dd/yy',
                    changeMonth: true,
                    changeYear: true,
                    yearRange: '1990:+0',
                    onSelect: function (date) {
                        scope.date = date;
                        scope.Search();
                        scope.$apply();
                    }
                });
            }
        };
    });
    app.controller('MyController', function ($scope, $http, $window) {
        PopulateChart('')
        $scope.Search = function (date) {
            PopulateChart($scope.date);
        }
        function PopulateChart(date) {
            $http({
                method: 'POST',
                url: 'Home/GetChartData',
                params: { date: date }
            }).then(function (response) {
                var category = response.data.Category;
                var series = response.data.Series;
                Highcharts.chart('chart', {
                    chart: { type: 'bar' },
                    title: { text: 'Country wise Order Distribution' },
                    subtitle: { text: 'Order Distribution' },
                    xAxis: {
                        categories: category,
                        title: { text: null }
                    },
                    yAxis: {
                        min: 0,
                        title: {
                            text: 'Count',
                            align: 'high'
                        },
                        labels: { overflow: 'justify' }
                    },
                    tooltip: { valueSuffix: '' },
                    plotOptions: {
                        bar: {
                            dataLabels: { enabled: true }
                        }
                    },
                    legend: {
                        layout: 'vertical',
                        align: 'right',
                        verticalAlign: 'top',
                        x: -40,
                        y: 80,
                        floating: true,
                        borderWidth: 1,
                        backgroundColor: Highcharts.defaultOptions.legend.backgroundColor || '#FFFFFF',
                        shadow: true
                    },
                    credits: { enabled: false },
                    series: series
                });
            });
        }
    });
</script>

Screenshot