make 'other' field optional and add inactivate/activate button
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<div class="form_wrapper">
|
||||
<form method="post">
|
||||
<input type="hidden" name="action" id="action" value="user_data_create">
|
||||
<form method="post">
|
||||
<input type="hidden" name="action" id="action" value="user_data_create">
|
||||
<div>
|
||||
<label class="desc" for="uk_name">Név:</label>
|
||||
<div><input type="text" name="uk_name" id="uk_name" size="8" class="field text fn" required></div>
|
||||
@@ -61,7 +61,7 @@
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<legend class="desc" for="uk_hand">Kéz: </legend>
|
||||
<div>
|
||||
@@ -162,84 +162,84 @@
|
||||
</div>
|
||||
|
||||
|
||||
</form>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$('#uk_parent_1').change(function() {
|
||||
$(".add_parent_1_block").toggle(this.value == 'null');
|
||||
});
|
||||
|
||||
$('#uk_parent_1').change(function() {
|
||||
$(".add_parent_1_block").toggle(this.value == 'null');
|
||||
});
|
||||
$('#uk_parent_2').change(function() {
|
||||
$(".add_parent_2_block").toggle(this.value == 'null');
|
||||
});
|
||||
|
||||
$('#uk_parent_2').change(function() {
|
||||
$(".add_parent_2_block").toggle(this.value == 'null');
|
||||
});
|
||||
$('#uk_school_sc_id').change(function() {
|
||||
$(".add_school").toggle(this.value == 'null');
|
||||
});
|
||||
|
||||
$('#uk_school_sc_id').change(function() {
|
||||
$(".add_school").toggle(this.value == 'null');
|
||||
});
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const form = document.querySelector(".form_wrapper form");
|
||||
const submitButton = form.querySelector('input.button.black[type="submit"]');
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const form = document.querySelector(".form_wrapper form");
|
||||
const submitButton = form.querySelector('input.button.black[type="submit"]');
|
||||
// Collect text inputs but exclude #uk_other
|
||||
const textInputs = Array.from(form.querySelectorAll(
|
||||
'input[type="text"], input[type="email"], textarea'
|
||||
)).filter(input => input.id !== "uk_other");
|
||||
|
||||
const textInputs = Array.from(form.querySelectorAll('input[type="text"], input[type="email"], textarea'));
|
||||
// Select fields that control conditional validation
|
||||
const parentSelect = form.querySelector('#uk_parent_1');
|
||||
const schoolSelect = form.querySelector('#uk_school_sc_id');
|
||||
const addressSelect = form.querySelector('#uk_address_scc_id');
|
||||
|
||||
// Select fields that control conditional validation
|
||||
const parentSelect = form.querySelector('#uk_parent_1');
|
||||
const schoolSelect = form.querySelector('#uk_school_sc_id');
|
||||
const addressSelect = form.querySelector('#uk_address_scc_id');
|
||||
|
||||
const conditionalFields = [
|
||||
{
|
||||
select: parentSelect,
|
||||
valueToIgnore: 'null',
|
||||
fields: [
|
||||
form.querySelector('#add_parent_1'),
|
||||
form.querySelector('#parent_1_email'),
|
||||
form.querySelector('#parent_1_phone')
|
||||
]
|
||||
},
|
||||
{
|
||||
select: schoolSelect,
|
||||
valueToIgnore: 'null',
|
||||
fields: [
|
||||
form.querySelector('#add_school')
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
function toggleSubmitButton() {
|
||||
let fieldsToCheck = [...textInputs];
|
||||
|
||||
// Exclude fields based on select value
|
||||
conditionalFields.forEach(group => {
|
||||
if (group.select.value !== group.valueToIgnore) {
|
||||
fieldsToCheck = fieldsToCheck.filter(field => !group.fields.includes(field));
|
||||
const conditionalFields = [{
|
||||
select: parentSelect,
|
||||
valueToIgnore: 'null',
|
||||
fields: [
|
||||
form.querySelector('#add_parent_1'),
|
||||
form.querySelector('#parent_1_email'),
|
||||
form.querySelector('#parent_1_phone')
|
||||
]
|
||||
},
|
||||
{
|
||||
select: schoolSelect,
|
||||
valueToIgnore: 'null',
|
||||
fields: [
|
||||
form.querySelector('#add_school')
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
function toggleSubmitButton() {
|
||||
let fieldsToCheck = [...textInputs];
|
||||
|
||||
// Exclude fields based on select value
|
||||
conditionalFields.forEach(group => {
|
||||
if (group.select.value !== group.valueToIgnore) {
|
||||
fieldsToCheck = fieldsToCheck.filter(field => !group.fields.includes(field));
|
||||
}
|
||||
});
|
||||
|
||||
// Check if any required field is empty
|
||||
const anyEmpty = fieldsToCheck.some(input => input.value.trim() === "");
|
||||
|
||||
// Check if uk_address_scc_id is still "null"
|
||||
const addressMissing = addressSelect.value === "null";
|
||||
|
||||
submitButton.disabled = anyEmpty || addressMissing;
|
||||
}
|
||||
|
||||
// Listen to input changes
|
||||
textInputs.forEach(input => {
|
||||
input.addEventListener("input", toggleSubmitButton);
|
||||
});
|
||||
|
||||
// Check if any required field is empty
|
||||
const anyEmpty = fieldsToCheck.some(input => input.value.trim() === "");
|
||||
// Listen to select changes
|
||||
[parentSelect, schoolSelect, addressSelect].forEach(select => {
|
||||
select.addEventListener("change", toggleSubmitButton);
|
||||
});
|
||||
|
||||
// Check if uk_address_scc_id is still "null"
|
||||
const addressMissing = addressSelect.value === "null";
|
||||
|
||||
submitButton.disabled = anyEmpty || addressMissing;
|
||||
}
|
||||
|
||||
// Listen to input changes
|
||||
textInputs.forEach(input => {
|
||||
input.addEventListener("input", toggleSubmitButton);
|
||||
// Initial validation
|
||||
toggleSubmitButton();
|
||||
});
|
||||
|
||||
// Listen to select changes
|
||||
[parentSelect, schoolSelect, addressSelect].forEach(select => {
|
||||
select.addEventListener("change", toggleSubmitButton);
|
||||
});
|
||||
|
||||
// Initial validation
|
||||
toggleSubmitButton();
|
||||
});
|
||||
|
||||
</script>
|
||||
</script>
|
||||
Reference in New Issue
Block a user