I follow the example code of book web development with clojure, 2nd edition and I have a problem with the file upload with google closure.
I test the file upload with Swagger and it response me 200 ok, I think the error is from the upload-file! function.(see below).
But I look up the closure api doc, it seems I use the correct function.
So I was in a trouble, I don't know why it doesn't work...
I need someone help.Here is my code(I use semantic-ui for ui components):
(defn upload-file! [upload-form-id status]
(reset! status nil)
(let [io (IframeIo.)]
(gev/listen
io goog.net.EventType.SUCCESS
#(reset! status [c/success-message "file uploaded successfully"]))
(gev/listen
io goog.net.EventType.ERROR
#(reset! status [c/warning-message "failed to upload the file"]))
(.setErrorChecker io #(= "error" (.getResponseText io)))
(.sendFromForm io (.getElementById js/document upload-form-id) "/upload")))
(defn upload-form []
(let [status (atom nil)
form-id "upload-form"]
(fn []
[c/modal
[:div "Upload File"]
[:div
(when @status @status)
[:div.ui.form
{:id form-id
:enc-type "multipart/form-data"
:method "POST"}
[:label {:for "file"} "select an image for upload"]
[:input {:id "file"
:name "file"
:type "file"}]]]
[:div
[:button.ui.primary.button
{:on-click #(upload-file! form-id status)}
"upload"]
[:button.ui.red.button
{:on-click #(do
(.modal (js/$ ".ui.modal") "hide")
(reset! status nil))}
"Cancel"]]
"upload"])))
the components:
(defn modal [header content footer id]
[:div.ui.modal
{:id id}
[:div.header header]
[:div.content content]
[:div.actions footer]])
(defn success-message [content]
[:div.ui.green.message
[:div.header content]])
So I solved my question, I should type [:form:ui.form]
rather than [:div.ui.form]
.
if you interest in the code, you can view this URL: upload image code