validation

This commit is contained in:
Corban-Lee Jones 2024-09-16 13:27:35 +01:00
parent 7f580a0f1f
commit 3287227f62
2 changed files with 41 additions and 10 deletions

View File

@ -217,7 +217,15 @@ $("#addSubscriptionBtn").on("click", async function() {
await showEditSubModal(-1);
});
function clearPreviousValidation() {
$("#subFormModal, #subAdvancedModal").removeClass("was-validated");
$("#subFormModal .invalid-feedback, #subAdvancedModal .invalid-feedback").remove();
$("#subFormModal .is-invalid, #subAdvancedModal .is-invalid").removeClass("is-invalid");
}
async function showEditSubModal(subId) {
clearPreviousValidation();
if (subId === -1) {
$("#subFormModal .form-create, #subAdvancedModal .form-create").show();
$("#subFormModal .form-edit, #subAdvancedModal .form-edit").hide();
@ -303,6 +311,7 @@ $("#subForm").on("submit", async function(event) {
// Populate formdata with [data-field] control values
$('#subForm [data-field], #subAdvancedModal [data-field]').each(function() {
const value = getValueFromField(this);
if (Array.isArray(value) && !value.length) { return };
formData.append($(this).data("field"), value);
});
@ -321,10 +330,18 @@ $("#subForm").on("submit", async function(event) {
filter => formData.append("filters", parseInt(filter.value))
);
// Unique Content Rules
$("#subUniqueRules option:selected").toArray().forEach(
rule => formData.append("unique_content_rules", parseInt(rule.value))
);
for (const [key, value] of formData.entries()) {
console.log(`${key}: ${value}`);
}
// // Unique Content Rules
// $("#subUniqueRules option:selected").toArray().forEach(
// rule => formData.append("unique_content_rules", parseInt(rule.value))
// );
for (const [key, value] of formData.entries()) {
console.log(`${key}: ${value}`);
}
// This field is constructed differently, so needs to be specifically added
formData.append("embed_colour", getColourInputVal("subEmbedColour", false));
@ -361,7 +378,21 @@ async function saveSubscription(id, formData, handleErrorMsg=true) {
response = id === "-1" ? await newSubscription(formData) : await editSubscription(id, formData);
}
catch (err) {
console.error(err);
if (typeof err !== "object" && err.responseJSON) {
return false
}
clearPreviousValidation();
for (const [fieldKey, message] of Object.entries(err.responseJSON)) {
const $field = $(`#subFormModal [data-field="${fieldKey}"], #subAdvancedModal [data-field="${fieldKey}"]`);
const $helpText = $field.closest("div").find(".form-text");
const $feedback = $(`<div class="invalid-feedback">${message}</div>`);
$field.addClass("is-invalid").prop("invalid", true);
$feedback.insertAfter($helpText.length ? $helpText : $field);
}
$("#subFormModal, #subAdvancedModal").addClass("was-validated");
if (handleErrorMsg) {
showToast("danger", "Subscription Error", err.responseText, 18000);

View File

@ -15,14 +15,14 @@
<div class="col-lg-6 pe-lg-4">
<div class="mb-4">
<label for="subName" class="form-label">Name</label>
<input type="text" id="subName" name="subName" class="form-control rounded-1" placeholder="My News Feed" data-field="name" tabindex="1">
<input type="text" id="subName" name="subName" class="form-control rounded-1" placeholder="My News Feed" required data-field="name" tabindex="1">
<div class="form-text">Use a unique name to refer to this subscription.</div>
</div>
</div>
<div class="col-lg-6 ps-lg-4">
<div class="mb-4">
<label for="subUrl" class="form-label">URL</label>
<input type="url" id="subUrl" name="subUrl" class="form-control rounded-1" placeholder="http://example.com/rss.xml" data-field="url" tabindex="2">
<input type="url" id="subUrl" name="subUrl" class="form-control rounded-1" placeholder="http://example.com/rss.xml" required data-field="url" tabindex="2">
<div class="form-text">Must point to a valid <a href="https://en.wikipedia.org/wiki/RSS" class="text-decoration-none" target="_blank">RSS</a> feed.</div>
</div>
</div>
@ -129,14 +129,14 @@
<div class="col-lg-6 ps-lg-4">
<div class="mb-4">
<label for="subPubThreshold" class="form-label">Publish Datetime Threshold</label>
<input type="datetime-local" name="subPubThreshold" id="subPubThreshold" class="form-control rounded-1" data-field="published_threshold" tabindex="9">
<input type="datetime-local" name="subPubThreshold" id="subPubThreshold" class="form-control rounded-1" required data-field="published_threshold" tabindex="9">
<div class="form-text">RSS content older than this datetime will be skipped.</div>
</div>
</div>
<div class="col-lg-6 pe-lg-4">
<div>
<label for="subUniqueRules">Unique Content Rules</label>
<select name="subUniqueRules" id="subUniqueRules" class="select-2" multiple data-dropdownparent="#subAdvancedModal" tabindex="11"></select>
<select name="subUniqueRules" id="subUniqueRules" class="select-2" multiple data-dropdownparent="#subAdvancedModal" required data-field="unique_content_rules" tabindex="10"></select>
<div class="form-text">Prevent duplicate articles, by identifying articles matched by these selected fields.</div>
</div>
</div>
@ -144,7 +144,7 @@
<div class="form-switch ps-0">
<label for="subArticleFetchImage" class="form-check-label mb-2">Show Images on Embed?</label>
<br>
<input type="checkbox" id="subArticleFetchImage" name="subArticleFetchImage" class="form-check-input ms-0 mt-0" data-field="article_fetch_image" tabindex="10">
<input type="checkbox" id="subArticleFetchImage" name="subArticleFetchImage" class="form-check-input ms-0 mt-0" data-field="article_fetch_image" tabindex="11">
<br>
<div class="form-text">Show images on the discord embed?</div>
</div>