KKlochko/simple-cljs-blog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add a validation for the edit article form.

Browse Source
This commit is contained in:
KKlochko
2024-04-19 09:41:31 +03:00
parent 4e6d36d98c
commit 88a9eb7749
3 changed files with 70 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/blog/handlers.cljs
+49 -1
View File
@@ -211,6 +211,54 @@
(res/status 500)
(res/send (ex-message err))))))))
(defn htmx-update-title-validation-handler-factory
[]
(fn [req res]
(let [channel (chan)
title (.-title (.-body req))
content (.-content (.-body req))]
(go
(try
(let [error (cond
(= (count title) 0)
"Tittle must be nonempty!!!"
:else
nil)]
(res/status 200)
(.render res "update_title_validation"
(-> {:error error
:title title
:layout false}
(clj->js))))
(catch js/Error err
(res/status 500)
(res/send (ex-message err))))))))
(defn htmx-update-content-validation-handler-factory
[]
(fn [req res]
(let [channel (chan)
title (.-title (.-body req))
content (.-content (.-body req))]
(go
(try
(let [error (cond
(= (count content) 0)
"Content must be nonempty!!!"
:else
nil)]
(res/status 200)
(.render res "update_content_validation"
(-> {:error error
:content content
:layout false}
(clj->js))))
(catch js/Error err
(res/status 500)
(res/send (ex-message err))))))))
(defn htmx-update-article-handler-factory
[client]
(fn [req res]
@@ -313,7 +361,7 @@
(res/send (ex-message err))))))))
(defn htmx-create-title-validation-handler-factory
[client]
[]
(fn [req res]
(let [channel (chan)
title (.-title (.-body req))
src/main/blog/server.cljs
+14
View File
@@ -149,6 +149,20 @@
(. app use "/htmx/admin/rows/article/:id/"
(handlers/user-not-authorized-factory))
(. app post "/htmx/validation/update-title/"
handlers/is-user-authorized
(handlers/htmx-update-title-validation-handler-factory))
(. app use "/htmx/validation/update-title/"
(handlers/user-not-authorized-factory))
(. app post "/htmx/validation/update-content/"
handlers/is-user-authorized
(handlers/htmx-update-content-validation-handler-factory))
(. app use "/htmx/validation/update-content/"
(handlers/user-not-authorized-factory))
(. app patch "/htmx/admin/rows/article/:id/"
handlers/is-user-authorized
(handlers/htmx-update-article-handler-factory client))
views/admin_panel.hbs
+7 -4
View File
@@ -163,7 +163,7 @@
<!-- Update modal -->
<form id="drawer-update-article"
x-data="{ id: null, title: '', created: '' }"
x-data="{ id: null, title: '', created: '', disabled: false }"
@update_article.window="id = $event.detail.id; title = $event.detail.title; created = $event.detail.created;"
x-init="$watch('id', () => htmx.process(htmx.find('#confirmUpdateButton')))"
tabindex="-1"
@@ -179,25 +179,28 @@
</button>
<div class="grid gap-4 sm:grid-cols-1 sm:gap-6 ">
<div class="space-y-4 sm:col-span-1 sm:space-y-6">
<div>
<div hx-target="this" hx-swap="outerHTML">
<label for="title" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Title</label>
<input type="text"
name="title"
hx-post="/htmx/validation/update-title/"
x-model="title"
id="update-title"
placeholder="Type article title"
required=""
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-[#2563eb] focus:border-[#2563eb] block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]">
</div>
<div>
<div hx-target="this" hx-swap="outerHTML">
<label for="content" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Content</label>
<textarea id="update-drawer-content" name="content" rows="4" class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-[#3b82f6] focus:border-[#3b82f6] dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]" placeholder="Write article here"></textarea>
<textarea id="update-drawer-content" name="content" hx-post="/htmx/validation/update-content/" rows="4" class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-[#3b82f6] focus:border-[#3b82f6] dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-[#3b82f6] dark:focus:border-[#3b82f6]" placeholder="Write article here"></textarea>
</div>
</div>
</div>
<div class="grid grid-cols-2 gap-4 mt-6 sm:w-1/2">
<button id="confirmUpdateButton"
x-on:htmx:load.window="if(htmx.find('#title').parentElement.innerHTML.toString().match(new RegExp('aria-invalid'))){disabled=true;}else{disabled=false;}"
x-bind:disabled="disabled"
data-drawer-toggle="drawer-update-article"
aria-controls="drawer-update-article"
type="submit"