diff --git a/weblate/static/loader-bootstrap.js b/weblate/static/loader-bootstrap.js
index e834f2b6e0ea..50e181724381 100644
--- a/weblate/static/loader-bootstrap.js
+++ b/weblate/static/loader-bootstrap.js
@@ -1422,10 +1422,9 @@ $(function () {
   $("input[name='period']").daterangepicker(
     {
       autoApply: false,
-      startDate:
-        $("input[name='period']#id_period").attr("data-start-date") || moment(),
-      endDate:
-        $("input[name='period']#id_period").attr("data-end-date") || moment(),
+      autoUpdateInput: false,
+      startDate: $("input[name='period']#id_period").attr("data-start-date"),
+      endDate: $("input[name='period']#id_period").attr("data-end-date"),
       alwaysShowCalendars: true,
       cancelButtonClasses: "btn-warning",
       opens: "left",
@@ -1485,6 +1484,12 @@ $(function () {
     (start, end, label) => {},
   );
 
+  $("input[name='period']").on("apply.daterangepicker", function (ev, picker) {
+    $(this).val(
+      `${picker.startDate.format("MM/DD/YYYY")} - ${picker.endDate.format("MM/DD/YYYY")}`,
+    );
+  });
+
   $("input[name='period']").on("cancel.daterangepicker", (_ev, picker) => {
     picker.element.val("");
   });