add max_count check

This commit is contained in:
Richard Schreiber
2024-03-11 12:01:37 +01:00
parent 28db030908
commit 648682c89d
2 changed files with 40 additions and 8 deletions
@@ -6,13 +6,13 @@
{% load eventsignal %}
{% load rich_text %}
{% for c in form.categories %}
<fieldset{% if c.max_count == 1 %} data-addon-exclusive{% endif %}>
<fieldset data-addon-max-count="{{ c.max_count }}"{% if c.multi_allowed %} data-addon-multi-allowed{% endif %}>
<legend>{{ c.category.name }}</legend>
{% if c.category.description %}
{{ c.category.description|rich_text }}
{% endif %}
{% if c.min_count == c.max_count %}
<p>
<p class="addon-count-desc">
{% blocktrans trimmed count min_count=c.min_count %}
You need to choose exactly one option from this category.
{% plural %}
@@ -21,7 +21,7 @@
</p>
{% elif c.min_count == 0 and c.max_count >= c.items|length and not c.multi_allowed %}
{% elif c.min_count == 0 %}
<p>
<p class="addon-count-desc">
{% blocktrans trimmed count max_count=c.max_count %}
You can choose {{ max_count }} option from this category.
{% plural %}
@@ -29,7 +29,7 @@
{% endblocktrans %}
</p>
{% else %}
<p>
<p class="addon-count-desc">
{% blocktrans trimmed with min_count=c.min_count max_count=c.max_count %}
You can choose between {{ min_count }} and {{ max_count }} options from
this category.
+36 -4
View File
@@ -150,10 +150,42 @@ var form_handlers = function (el) {
});
el.find("fieldset[data-addon-exclusive]").on('change', function (e) {
if (e.target.checked) {
$(".availability-box input:checked", this).not(e.target).prop('checked', false).trigger('change');
}
el.find("fieldset[data-addon-max-count]").each(function() {
// usually addons are only allowed once one per item
var multipleAllowed = this.hasAttribute("data-addon-multi-allowed");
var $inputs = $(".availability-box input", this);
var max = parseInt(this.getAttribute("data-addon-max-count"));
var desc = $(".addon-count-desc", this).text().trim();
this.addEventListener("change", function (e) {
var variations = e.target.closest(".variations");
if (variations && !multipleAllowed && e.target.checked) {
// deactivate all other checkboxes inside this variations
$(".availability-box input:checked", variations).not(e.target).prop("checked", false).trigger("change");
}
if (max === 1) {
if (e.target.checked) {
$inputs.filter(":checked").not(e.target).prop("checked", false).trigger("change");
}
return;
}
var total = $inputs.toArray().reduce(function(a, e) {
return a + (e.type == "checkbox" ? (e.checked ? parseInt(e.value) : 0) : parseInt(e.value) || 0);
}, 0);
if (total > max) {
if (e.target.type == "checkbox") {
e.target.checked = false;
} else {
e.target.value = e.target.value - (total - max);
}
$(e.target).trigger("change").closest(".availability-box").tooltip({
"title": desc,
}).tooltip('show');
e.preventDefault();
} else {
$(".availability-box", this).tooltip('destroy')
}
});
});
el.find("input[name*=question], select[name*=question]").change(questions_toggle_dependent);