practicalli 2021-04-29 | Slack Archive

Oliver12:04:49

I am looking for some similar example like below (from John's banking app example) but for populating an HTML table. Any suggestions?

;; Abstracting hiccup with functions
  ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;

  (defn unordered-list [items]
    [:ul
     (for [i items]
       [:li i])])

  ;; Many lines of code can now be reduced to a single line

  ;; [:div
  ;;  (unordered-list ["collection" "of" "list" "items"])]

Simple example for data:

(def player-data [{:name "Oliver", :score 100} {:name "Revilo", :score 50}])

Oliver13:04:06

Finally figured out something 😅

(html5 (for [row player-data]
         [:tr (map (fn [x] [:td (val x)]) row)]))
;; => "\n<html><tr><td>Oliver</td><td>100</td></tr><tr><td>Revilo</td><td>50</td></tr></html>"

practicalli-johnny18:04:03

@oliver.heck I think a more typical approach would be to use a let within the for expression. As for is a macro, then you can use the :let shorter form. This code provides the same output

(html5 (for [row player-data
             :let [player (:name row)
                   score (:score row)]]
         [:tr [:td player] [:td score]]))

😀 3

practicalli-johnny18:04:51

The last part of the for expression uses the local names created by the let to populate the hiccup structure as the code iterates through player-data

2021-04-29

Channels