fix access to form in checkValidity

This commit is contained in:
Girish Ramakrishnan
2025-12-05 17:36:48 +01:00
parent 620974217a
commit c8842cc71f
11 changed files with 23 additions and 22 deletions

View File

@@ -16,7 +16,6 @@ const backupSitesModel = BackupSitesModel.create();
const systemModel = SystemModel.create();
const dialog = useTemplateRef('dialog');
const form = useTemplateRef('form');
const step = ref('storage');
const newSiteId = ref('');
const name = ref('');
@@ -227,10 +226,10 @@ function onCancel() {
dialog.value.close();
}
const isValid = ref(false);
const form = useTemplateRef('form');
const isFormValid = ref(false);
function checkValidity() {
isValid.value = form.value.checkValidity();
isFormValid.value = form.value ? form.value.checkValidity() : false;
}
defineExpose({
@@ -301,7 +300,7 @@ defineExpose({
<div v-if="step === 'storage'">
<form @submit.prevent="onSubmit()" autocomplete="off" ref="form" @change="checkValidity()">
<fieldset :disabled="busy">
<input style="display: none;" type="submit" :disabled="!isValid"/>
<input style="display: none;" type="submit" :disabled="!isFormValid"/>
<FormGroup>
<label for="nameInput">{{ $t('backups.configureBackupStorage.name') }}</label>
@@ -378,7 +377,7 @@ defineExpose({
<div style="display: flex; gap: 6px; align-items: end;">
<Button secondary v-if="!busy" :disabled="busy" @click="onCancel()">{{ $t('main.dialog.cancel') }}</Button>
<Button primary :disabled="busy || !isValid" :loading="busy" @click="onSubmit()">{{ useEncryption ? $t('main.action.next') : $t('main.dialog.save') }}</Button>
<Button primary :disabled="busy || !isFormValid" :loading="busy" @click="onSubmit()">{{ useEncryption ? $t('main.action.next') : $t('main.dialog.save') }}</Button>
</div>
</div>
</fieldset>