Sort out dates for flutter check box/ Date scheduler

Question

I have a service which returns a list of dates, which the user can opt for a future payment.

In the UI, there are three drop down boxes, one each for year, month and date.

Now when the user selects a particular year, then the months shown in the next drop down should only contain months corresponding to that particular selected year and similarly when the month is selected only the corresponding dates to that particular selected month should be shown.

The service response is something like below :

[ 
   { 
      "availableDate":"03/13/2020"
   },
   { 
      "availableDate":"04/14/2020"
   },
   { 
      "availableDate":"01/15/2020"
   },
   { 
      "availableDate":"01/16/2020"
   },
   { 
      "availableDate":"02/17/2020"
   },
   { 
      "availableDate":"02/18/2020"
   },
   { 
      "availableDate":"02/22/2021"
   }
]

I was able to split out the dates,months and years and when I tried to change values using onChange, didn't get the desired result. Could some one please help me with the logic or maybe give me a link to get started?

Answer 1

I have found out a solution.

First initialize the variables :

  List _serviceData = [];
  List _yearList = [];
  List _monthList = [];
  List _dateList = [];
  List<SchedulerYear> _yearData = new List<SchedulerYear>();
  List<SchedulerMonth> _monthData = new List<SchedulerMonth>();
  List<SchedulerDate> _dateData = new List<SchedulerDate>();
  var yearData = [];
  var monthData = [];
  var _loadData, _year, _month, _date;

Models used :

class SchedulerYear {
  String year;
  String month;
  String date;
  SchedulerYear({this.year,this.month,this.date});
  @override
  String toString() {
    return '$year $month $date';
  }
}

class SchedulerMonth {
  String month;
  String date;
  SchedulerMonth({this.month,this.date});
  @override
  String toString() {
    return '$month $date';
  }
}

class SchedulerDate {
  String date;
  SchedulerDate({this.date});
  @override
  String toString() {
    return '$date';
  }
}

And finally the functions :

 List<DropdownMenuItem<String>> getMenuItems(List options) {
    List<DropdownMenuItem<String>> items = List();
    for (String n in options) {
      items.add(DropdownMenuItem(value: n, child: Text(n)));
    }
    return items;
  }

 _getYears() async {
    _serviceData = await serviceHandler.fadfj;  // the service response as a List
    _yearData = [];
    _yearList = [];
    _yearItems = [];
    for (int i = 0; i < _serviceData.length; i++) {
      _loadData = _serviceData[i].toString();
      _month = _loadData.split('/')[0];
      _date = _loadData.split('/')[1];
      _year = _loadData.split('/')[2];
      _yearData.add(SchedulerYear(year: _year, month: _month, date: _date));
      _yearList.add(_year);
    }
    _yearList = _yearList.toSet().toList();
    _yearItems = getMenuItems(_yearList);
    _selectedYear = _yearItems[0].value;
    yearData = _yearData;
  }

  _getMonths(selectedYear) {
    _dateItems = [];
    _dateItems = getMenuItems(_initialDate);
    _selectedDate = _dateItems[0].value;
    _yearData = yearData;
    _monthData = [];
    _monthList = [];
    _monthItems = [];
    for (int i = 0; i < _yearData.length; i++) {
      if (_yearData[i].year == selectedYear) {
        _monthData.add(SchedulerMonth(month: _yearData[i].month, date: _yearData[i].date));
        _monthList.add(_yearData[i].month);
      }
    }
    monthData = _monthData;
    _monthList = _monthList.toSet().toList();
    _monthItems = getMenuItems(_monthList);
    _selectedMonth = _monthItems[0].value;
  }

  _getDates(selectedMonth) {
    _monthData = monthData;
    _dateData = [];
    _dateList = [];
    _dateItems = [];
    for (int i = 0; i < _monthData.length; i++) {
      if (_monthData[i].month == selectedMonth) {
        _dateData.add(SchedulerDate(date: _monthData[i].date));
        _dateList.add(_monthData[i].date);
      }
    }
    _dateList = _dateList.toSet().toList();
    _dateItems = getMenuItems(_dateList);
    _selectedDate = _dateItems[0].value;
  }

_getYears() is called inside init() and the _getMonths(selectedYear) is called onChange of years dropdown button and _getDates(selectedMonth) on the months dropdown button