function dataSelectChange() {

    $('#loader').show();
    $('#state-legend').empty();
    $('#state-legend').append(`
  <div class="legend-internal">
  <span><span style="background-color: ${colorGrad[0]}"></span>${layData[0]}</span>
  <span><span style="background-color: ${colorGrad[1]}"></span>${layData[1]}</span>
  <span><span style="background-color: ${colorGrad[2]}"></span>${layData[2]}</span>
  <span><span style="background-color: ${colorGrad[3]}"></span>${layData[3]}</span>
  <span><span style="background-color: ${colorGrad[4]}"></span>${layData[4]}</span>
  <span><span style="background-color: ${colorGrad[5]}"></span>${layData[5]}</span>
  <span><span style="background-color: ${colorGrad[6]}"></span>${layData[6]}</span>
  <span><span style="background-color: ${colorGrad[7]}"></span>${layData[7]}</span>
  </div>`)
    var colors = ['#eec524', '#24cfa2', '#e70c0c']


    var selectedProv = $("#province-select").val()
    var selectedDist = $("#district-select").val()
    var type = $("#data-select").val()
    var startDate = $("#date-range").data('daterangepicker').startDate.format('YYYY-MM-DD');
    var endDate = $("#date-range").data('daterangepicker').endDate.format('YYYY-MM-DD');

    if(typeof selectedDist !== "undefined" && selectedDist != "" && selectedDist != null) {
        selectedDist = $("#district-select").val()
        selectedProv = $("#province-select").val()
        updateProvDistrictsLayer(selectedProv, startDate, endDate, type)
        var distDataURL = eachDist + "?start_date='" + startDate + "'&end_date='" + endDate + "'&type=" + type + "&district=" + parseInt(selectedDist)
        $.ajax({
            type: "GET",
            url: distDataURL,
            dataType: "json",
            success: function (districtCases) {
                modifyDistrictData(districtCases)
            }
        });
        $('#loader').hide();

    } else if(typeof selectedProv != "undefined" && selectedProv != "" && selectedProv != null) {
        updateProvDistrictsLayer(selectedProv, startDate, endDate, type)
        $('#loader').hide();

    } else {
        updateNepalGeo(startDate, endDate, type)
        $('#loader').hide();
        if(type === "all") {
            $('#state-legend').empty();
            var legendData = `<div class="legend-internal">`;
            for(const colorCode in provLegend) {
                var color = provLegend[colorCode];
                legendData += `<span><span style="background-color: ${color}"></span>${colorCode}</span>`
            }
            legendData += `</div>`
            $('#state-legend').append(legendData)
        }
    }
}
