dates work again

This commit is contained in:
2024-12-11 22:51:17 -08:00
parent 40fee3ad74
commit aaeafae871
4 changed files with 30 additions and 10 deletions

View File

@@ -124,6 +124,7 @@ initDatepicker = function(elem) {
console.log('datepicker in modal') console.log('datepicker in modal')
return new Datepicker(elem, {format: "mm/dd/yyyy", autohide: true, container: "#modal-content .modal-card"}); return new Datepicker(elem, {format: "mm/dd/yyyy", autohide: true, container: "#modal-content .modal-card"});
} else { } else {
console.log('datepicker normal')
return new Datepicker(elem, {format: "mm/dd/yyyy", autohide: true}); return new Datepicker(elem, {format: "mm/dd/yyyy", autohide: true});
} }

File diff suppressed because one or more lines are too long

View File

@@ -335,21 +335,40 @@
(dissoc :size))]) (dissoc :size))])
(defn date-input- [{:keys [size] :as params}] (defn date-input- [{:keys [size] :as params}]
[:div.shrink {:x-data (hx/json {:value (:value params)})} [:div.shrink {:x-data (hx/json {:value (:value params)
:dp nil})
"@change-date.camel" "$dispatch('change')"
}
[:input [:input
(-> params (-> params
(update :class (fnil hh/add-class "") default-input-classes) (update :class (fnil hh/add-class "") default-input-classes)
(assoc :x-modelable "value") (assoc :x-model "value")
(assoc "x-tooltip.on.focus" "{content: ()=>$refs.tooltip.innerHTML, theme: 'light', onMount(i) { htmx.process(i.popper); }, allowHTML: true, interactive:true}")
(assoc :type "text") (assoc :type "text")
(assoc "autocomplete" "off") (assoc "autocomplete" "off")
(assoc :x-data (hx/json {:dp nil}) ) (assoc "@change" "value = $event.target.value;")
(assoc :x-init " dp = initDatepicker($el);") #_(assoc "hx-on" (hiccup/raw "changeDate: htmx.trigger(this, \"change\") "))
(update :class #(str % (use-size size) " w-full"))
(dissoc :size))]
[:template {:x-ref "tooltip" }
[:div.shrink
[:div
(-> params
(update :class (fnil hh/add-class "") default-input-classes)
(assoc :type "text")
(assoc :value (:value params))
;; the data-date field has to be bound before the datepicker can be initialized
(assoc :x-init "$nextTick(() => { dp = initCalendar($el); ;}); ")
(assoc "x-effect" "if(dp) { dp.setDate(value); } ")
(assoc ":data-date" "value")
(assoc "@htmx:before-history-save" "destroyDatepicker(dp)") (assoc "@htmx:before-history-save" "destroyDatepicker(dp)")
(assoc "@htmx:before-cleanup-element" "destroyDatepicker(dp)") (assoc "@htmx:before-cleanup-element" "destroyDatepicker(dp)")
(assoc "@change" "value = $event.target.value;") (assoc "x-destroy" "destroyDatepicker(dp)")
(assoc "hx-on" (hiccup/raw "changeDate: htmx.trigger(this, \"change\") ")) (assoc "@change-date.camel" "value = dp.getDate(\"mm/dd/yyyy\"); ")
(update :class #(str % (use-size size) " w-full")) (update :class #(str % (use-size size) " w-full"))
(dissoc :size))]]) (dissoc :size :name :x-model :x-modelable))]]]])
(defn multi-calendar-input- [{:keys [size] :as params}] (defn multi-calendar-input- [{:keys [size] :as params}]
(let [value (str/join ", " (let [value (str/join ", "