Clojurescript - Placeholder in text box - clojure

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.

Related

Checkbox in Luminus

I started to learn Clojure this week, specifically I'm learning web development with Luminus. Since I want to understand the CRUD process, I setup a function to save my post into the DB:
(defn save-post! [{:keys [params]}]
(if-let [errors (validate-post params)]
(-> (response/found "/posts")
(assoc :flash (assoc params :errors errors)))
(do
(db/save-post!
(assoc params :created_at (java.util.Date.)))
(response/found "/posts"))))
The query is pretty basic:
-- :name save-post! :! :n
-- :doc creates a new post record
INSERT INTO posts
(title, body, active, created_at)
VALUES (:title, :body, :active, :created_at)
but the HTML form has a checkbox field:
<input type="checkbox" name="active" value="1">Published<br />
and when it is not selected, the field is not send and the SQL insert query sends the error message "No active field". How can I check if the element "active" is set and add it to "params" as true or false?
Something like:
(assoc params :active (if (nil? params/active) false true))
after the ":created_at (java.util.Date.)" line.
How can I check if the element "active" is set and add it to "params" as true or false?
Looks like your code isn't far from working. You'll need to check the params map to see if it has the checkbox's value. If (:active params) is equal to "1" when the checkbox is checked, then you might do something like this:
(assoc params :active (= "1" (:active params)))
But what this is really trying to do is update a particular value in the map, which can be done more idiomatically:
(update params :active #(= "1" %))
Where the final argument is a function that takes any current value of the keyword and returns the new value.
Another potential gotcha: you may not want to use the params map as direct input to your DB query, because it could very easily contain keys/values that you don't want or expect. It'd be safer to pull only the values you need from it explicitly e.g. (select-keys params [:title :body :active]).
(def params {:active "1", :admin true}) ;; wouldn't want admin to leak through!
(-> params
(select-keys [:title :body :active])
(assoc :created_at (java.util.Date.))
(update :active #(= "1" %)))
;;=> {:active true, :created_at #inst "2017-10-09T20:16:06.167-00:00"}

Reagent-Forms radio buttons displaying as text fields

I am trying to display a group of radio buttons in a reagent/cljs app. I have followed the same process from http://yogthos.github.io/reagent-forms-example.html but the radio buttons I am displaying are showing up as textfield input boxes.
(def ^:private options (atom nil))
(defn set-options []
(reset! options
[{:name "label name"}
{:name "label name"}
{:name "label name"}]))
(defn set-radio-buttons []
(set-options)
(for [option #options]
[:div.radio
[:label
[:input {:field :radio}]
(option :name)]]))
(defn response-box []
[:div#response
(set-radio-buttons)])
I am then placing response-box in the ui layer of the app.
Thanks
Field is not a correct input element attribute.
[:input {:field :radio}]
(option :name)]]))
Should probably be
[:input {:type :radio}]
(option :name)]]))

Repetitive structure in Clojure

It is said in the book "Web Development with Clojure" that the code
(defn registration-page []
(layout/common
(form-to [:post "/register"]
(label "id" "screen name")
(text-field "id")
[:br]
(label "pass" "password")
(password-field "pass")
[:br]
(label "pass1" "retype password")
(password-field "pass1")
[:br]
(submit-button "create account"))))
can be rewritten using a helper function as following:
(defn control [field name text]
(list (on-error name format-error)
(label name text)
(field name)
[:br]))
(defn registration-page []
(layout/common
(form-to [:post "/register"]
(control text-field :id "screen name")
(control password-field :pass "Password")
(control password-field :pass1 "Retype Password")
(submit-button "Create Account"))))
My question is: In the alternative code, why the value of the parameter name is not a string? For example, why is it (control text-field :id "screen name"), not (control text-field "id" "screen name") ?
I'm not familiar with Hiccup and I don't have the book you mentioned. But by reading Hiccup source code, you can find:
Label is calling make-id function which it calls as-str. Have a look at that function and see what it is doing.
(defn ^String as-str
"Converts its arguments into a string using to-str."
[& xs]
(apply str (map to-str xs)))
That will leads you to ToString protocol.
Pass strings instead of keywords in the snippet you posted and see what is happening!
Source code is the best documentation we can have!

how to get this working in webnoir

I am trying to do this in webnoir.
This works:
(defpage [:post "/testurl] {:keys [name phone]}
(html5
(str "name: " name)
(str "phone: " phone)))
Now I want to generate defpages for many modules, each has a list of different fields. And I want to call the defpages from a function. The defpage must accept post for the fields.
Basically I have this: (def fields1 ["Name" "Phone" "Email" "xyz"])
And I would like to pass this to defpage, instead of having to specify the keys manually.
The fields might change in the future and that's why I want my code to pick up the fields and create the defpages dynamically on server startup.
Is it possible?
Thank you for all your help!
You can do this with a macro:
(defmacro defpages [pages]
`(do
~#(map (fn [page]
`(~'defpage [:post ~(str "/" (page :name))]
{:keys ~(into [] (map symbol (page :fields)))}
(~'html5
~#(map (fn [field]
`(str ~(str field ": ")
~(symbol field)))
(page :fields))))) pages)))
(defpages [{:name "testurl"
:fields ["name" "phone"]}
{:name "user"
:fields ["age" "address"]}])

Parsing values from multiple checkboxes using compojure

I have created small compojure web application, which can display multiple values, fetched from other website, using provided URL. At the moment, this URL is hard coded in one of my functions, and now I would like to add feature for dynamical URL creation, based upon values in text field and checkbox.
This is how my page looks like:
(defn view-layout [& content]
(html [:body content]))
(defn view-input []
(view-layout
[:h2 "Find"]
[:form {:method "post" :action "/"}
( for [category ["Cat1" "Cat2" "Cat3"]]
[:input {:type "checkbox" :id category } category ] )
[:br]
[:input {:type "text" :id "a" :value "insert manga name"}] [:br]
[:input.action {:type "submit" :value "Find"}]
[:a {:href "/downloads"} "Downloads"]]))
(defn view-output []
(view-layout
[:h2 "default images"]
[:form {:method "post" :action "/"}
(for [name (get-content-from-url (create-url))]
[:label name [:br]]
)]))
(defn create-manga-url
[]
"http://www.mysite.net/search/?tfield=&check=000")
Here are the routes:
(defroutes main-routes
(GET "/" []
(view-input))
(GET "/downloads" []
(view-downloads))
(POST "/" []
(view-output) ))
At the moment, I need help with (create-url) function (returns a string), where I would like to fetch all fields, mandatory for my search (one text field and 3 checkboxe's) , and parse values from them, which will be fed into (concatenated) the URL - for checkbox, if checked, the check section will have value 1, instead of 0, or remain 0 if not (check=100, or 010, 011 if two check boxes were selected) . In case of text field, the tfield=userinputtext.
EDIT
I spent a lot of time as a .Net and Java developer, and this part of compojure is a total mystery for me.
This is what I would like to achieve with (create-url) function (pseudo code written in OO style):
(defn create-url [*text_field cbox1 cbox2 cbox3*]
(def url "http://www.mysite.net/search/?")
(def tfield "tfield=")
(def cbox "&check=")
(if (checked? cbox1)
(str cbox "1")
(str cbox "0"))
(if (checked? cbox2)
(str cbox "1")
(str cbox "0"))
(if (checked? cbox3)
(str cbox "1")
(str cbox "0"))
(str tfield (:value text_field))
(str url tbox cbox))
I apologize for how this pseudo code looks like, but this is the part that I would like to learn: How can I scoop data from form, and parse it (in this case i would like to attachh values from form fields into the string)
Can anyone help me with this?
First, you need to add 'name' attributes to your HTML input elements. The 'id' attributes aren't sent to the server on post.
Next, I guess a quick way of doing this similar to your example is:
(POST "/" [a Cat1 Cat2 Cat3] (create-url a [Cat1 Cat2 Cat3]))
and then something like this:
(defn checked? [c]
(and c (= c "on")))
(defn checked->num [c]
(if (checked? c) "1" "0"))
(defn create-url [a cats]
(str "x?tfield=" a "&check="
(apply str (for [c cats] (checked->num c)))))
Or just drop the two helpers:
(defn create-url [a cats]
(str "x?tfield=" a "&check="
(apply str (map #(if (= "on" %) "1" "0") cats))))