I want to create a textbox in my homepage so I have written the following:
(defn home-page []
[:div.container
[:h1 "Enter Code:"]
[c/text-input "id" :id "enter code" fields]])
where the c/text-input is contained in another namespace (common.cljs) which I have required.
The code in the common.cljs namespace is the following:
(defn input [type id placeholder fields]
[:input.form-control.input-lg
{:type type
:placeholder placeholder
:value (id @fields)
:on-change #(swap! fields assoc id (-> % .-target .-value))}])
(defn form-input [type label id placeholder fields optional?]
[:div.form-group
[:label label]
(if optional?
[input type id placeholder fields]
[:div.input-group
[input type id placeholder fields]
[:span.input-group-addon
"✱"]])])
(defn text-input [label id placeholder fields & [optional?]]
(form-input :text label id placeholder fields optional?))
However my problem arises where if I remove [c/text-input "id" :id "enter code" fields]]
from my code the webpage loads as normal. With this line of code in nothing happens.
I cannot figure out my mistake and any help would be appreciated.
(P.S I am using a luminus framework if that is of any help)
Looking at the code you posted, it looks like fields
should be an atom
containing a map
where the value of the field will be stored under the key id
. The code should look more or less like this:
(defn home-page []
(let fields (atom {})
[:div.container
[:h1 "Enter Code:"]
[c/text-input "id" :id "enter code" fields]]))
I hope this proves to be helpful.