Clear the DateRangePicker Selection

Environment

Product

Progress® Kendo UI® DateRangePicker for jQuery

Description

This sample demonstrates how you can clear the values of the date range picker using the range method.

Solution

    <div id="daterangepicker"></div>
    <br/>
    <button onclick='buttonClick();'>Clear Range Picker</button>
    <script>
      $("#daterangepicker").kendoDateRangePicker({
        range: {
          start: new Date(2019, 10, 11),
          end: new Date(2019, 10, 22)
        }
      });
      function buttonClick(){
        var daterangepicker = $("#daterangepicker").data("kendoDateRangePicker");
        daterangepicker.range({
          start: null,
          end: null
        });
      }
    </script>