Makes an experience for balance sheet multi choice

src/clj/auto_ap/ssr/components/inputs.clj

@@ -356,22 +356,28 @@
                         (for [v (:value params) 
                               :when v] 
                           (some-> v (atime/unparse-local atime/normal-date))))]
-    (println "MY VALUE IS" value)
-    [:div.shrink {:x-data (hx/json {:value value})}
-     [:input
+    [:div.shrink {:x-data (hx/json {:value value
+                                    :dp nil })
+                  :x-modelable "value"
+                  :x-model (:x-model params) }
+     [:template {:x-for "v in value"}
+      [:input {:type "hidden" :name (:name params) :x-model "v"}]]
+     [:div
       (->  params
            (update :class (fnil hh/add-class "") default-input-classes)
-           (assoc :x-modelable "value")
            (assoc :type "text")
-           (assoc :x-data (hx/json {:dp nil}) )
            (assoc :value value)
-           (assoc :x-init " dp = initMultiDatepicker($el);")
+           ;; the data-date field has to be bound before the datepicker can be initialized
+           (assoc :x-init "$nextTick(() =>  { dp = initMultiDatepicker($el, value); ;}); ")
+           (assoc "x-effect" "setTimeout(()=> { if(dp) { dp.setDate(Array.from(value), {clear: true}); }}, 2000) ")
+           (assoc ":data-date" "Array.prototype.join.call(value, ', ')")
            (assoc "@htmx:before-history-save" "destroyDatepicker(dp)" )
            (assoc "@htmx:before-cleanup-element" "destroyDatepicker(dp)" )
-           (assoc "@change" "value = $event.target.value;")
-           (assoc "hx-on" (hiccup/raw "changeDate: htmx.trigger(this, \"change\") "))
+           (assoc "x-destroy" "destroyDatepicker(dp)")
+           (assoc "@change-date.camel" "console.log('date changing'); value = dp.getDate(\"mm/dd/yyyy\");")
+
            (update :class #(str % (use-size size) " w-full"))
-           (dissoc :size))]]))
+           (dissoc :size :name :x-model :x-modelable))]]))