AddUserModal - username/email validation

ref #12
This commit is contained in:
Philipp Dormann 2021-01-17 17:14:34 +01:00
parent 10d7955f99
commit ff14f024af

View File

@ -28,7 +28,10 @@
$: isLastnameValid = lastname_input_value.trim().length !== 0; $: isLastnameValid = lastname_input_value.trim().length !== 0;
$: isFirstnameValid = firstname_input_value.trim().length !== 0; $: isFirstnameValid = firstname_input_value.trim().length !== 0;
$: createbtnenabled = $: createbtnenabled =
isFirstnameValid && isLastnameValid && isEmailValid && isPasswordValid; isFirstnameValid &&
isLastnameValid &&
isPasswordValid &&
!(!isEmailValid && username_input_value.trim().length === 0);
(function () { (function () {
document.onkeydown = function (e) { document.onkeydown = function (e) {
e = e || window.event; e = e || window.event;
@ -54,7 +57,7 @@
firstname: firstname_input_value, firstname: firstname_input_value,
lastname: lastname_input_value, lastname: lastname_input_value,
middlename: middlename_input_value, middlename: middlename_input_value,
password: password_input_value password: password_input_value,
}; };
if (email_input_value !== "") { if (email_input_value !== "") {
postdata.email = email_input_value; postdata.email = email_input_value;
@ -238,18 +241,21 @@
<input <input
autocomplete="off" autocomplete="off"
placeholder={$_('e-mail-adress')} placeholder={$_('e-mail-adress')}
class:border-red-500={!isEmailValid}
class:focus:border-red-500={!isEmailValid}
class:focus:ring-red-500={!isEmailValid}
bind:value={email_input_value} bind:value={email_input_value}
bind:this={email_input} bind:this={email_input}
type="email" type="email"
name="email" name="email"
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" /> class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
{#if !isEmailValid} <!-- {#if !isEmailValid}
<span <span
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"> class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
{$_('valid-email-is-required')} valid email or username is required
</span>
{/if} -->
{#if !isEmailValid && username_input_value.trim().length === 0}
<span
class="mt-8 flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
valid email or username is required
</span> </span>
{/if} {/if}
</div> </div>