Persist Entered Dates

The following example demonstrates how to persist the date that is already entered in the DatePicker when the user navigates to another page and then comes back.

While supported by default in modern browsers, this functionality is not provided by Internet Explorer 9 and earlier.

Example

    <a href="http://www.telerik.com" alt="navigate">navigate</a>
    <div id="example">
      <div id="cap-view" class="demo-section k-header">
        <input id="color" name="color" />
        <input id="color_hidden" name="color" type="hidden" />

        <input id="datepicker" name="datepicker" />
        <input id="datepicker_hidden" name="datepicker" type="hidden" />
      </div>
    </div>
    <script>
      $(document).ready(function() {
        var datepicker_hidden = $("#datepicker_hidden");

        $("#datepicker").kendoDatePicker({
          value: datepicker_hidden.val(),
          change: function() {
            datepicker_hidden.val(this.element.val());
          }
        });

        var data = [
          { text: "Black", value: "1" },
          { text: "Orange", value: "2" },
          { text: "Grey", value: "3" }
        ];

        var color_hidden = $("#color_hidden");

        $("#color").kendoDropDownList({
          dataTextField: "text",
          dataValueField: "value",
          dataSource: data,
          value: color_hidden.val(),
          change: function() {
            color_hidden.val(this.value());
          },
          index: 0
        });
      });
    </script>

Persist Entered Dates

Example

See Also

Give article feedback