Add a validation for the about form in the admin panel.

This commit is contained in:
2024-04-19 08:24:18 +03:00
parent a8fc0ab70c
commit 634f7e41e2
4 changed files with 40 additions and 2 deletions
+8
View File
@@ -0,0 +1,8 @@
<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="about-content" name="content" hx-post="/htmx/validation/about/" 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 about you and your blog here"
{{#if error}}aria-invalid="true"{{/if}}>{{ about-content }}</textarea>
{{#if error}}
<div class='text-sm font-bold leading-tight tracking-tight text-red-600 mt-2'>{{ error }}</div>
{{/if}}
</div>
+2 -2
View File
@@ -16,9 +16,9 @@
<!-- form -->
<form class="p-4" x-show="show">
<div class="grid gap-4 mb-4 sm:grid-cols-1">
<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="about-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 about you and your blog here">{{ about-content }}</textarea>
<textarea id="about-content" name="content" hx-post="/htmx/validation/about/" 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 about you and your blog here">{{ about-content }}</textarea>
</div>
</div>
<button type="submit" hx-patch="/htmx/about/" hx-swap="none" class="text-white inline-flex items-center bg-[#1d4ed8] hover:bg-[#1e40af] focus:ring-4 focus:outline-none focus:ring-[#93c5fd] font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-[#2563eb] dark:hover:bg-[#1d4ed8] dark:focus:ring-[#1e40af]">