Custom form configuration #268
2 changed files with 4 additions and 11 deletions
|
|
@ -45,10 +45,10 @@
|
||||||
<button class="nav-link {% if forloop.first %}active{% endif %}{% if fieldset.has_mandatory %} has-mandatory{% endif %}"
|
<button class="nav-link {% if forloop.first %}active{% endif %}{% if fieldset.has_mandatory %} has-mandatory{% endif %}"
|
||||||
id="{{ fieldset.title|slugify }}-tab"
|
id="{{ fieldset.title|slugify }}-tab"
|
||||||
data-bs-toggle="tab"
|
data-bs-toggle="tab"
|
||||||
data-bs-target="#{{ fieldset.title|slugify }}"
|
data-bs-target="#custom-{{ fieldset.title|slugify }}"
|
||||||
type="button"
|
type="button"
|
||||||
role="tab"
|
role="tab"
|
||||||
aria-controls="{{ fieldset.title|slugify }}"
|
aria-controls="custom-{{ fieldset.title|slugify }}"
|
||||||
aria-selected="{% if forloop.first %}true{% else %}false{% endif %}">
|
aria-selected="{% if forloop.first %}true{% else %}false{% endif %}">
|
||||||
{{ fieldset.title }}
|
{{ fieldset.title }}
|
||||||
{% if fieldset.has_mandatory %}<span class="mandatory-indicator">*</span>{% endif %}
|
{% if fieldset.has_mandatory %}<span class="mandatory-indicator">*</span>{% endif %}
|
||||||
|
|
@ -60,9 +60,9 @@
|
||||||
<div class="tab-content" id="myTabContent">
|
<div class="tab-content" id="myTabContent">
|
||||||
{% for fieldset in form.get_fieldsets %}
|
{% for fieldset in form.get_fieldsets %}
|
||||||
<div class="tab-pane fade my-2 {% if fieldset.hidden %}d-none{% endif %}{% if forloop.first %}show active{% endif %}"
|
<div class="tab-pane fade my-2 {% if fieldset.hidden %}d-none{% endif %}{% if forloop.first %}show active{% endif %}"
|
||||||
id="{{ fieldset.title|slugify }}"
|
id="custom-{{ fieldset.title|slugify }}"
|
||||||
role="tabpanel"
|
role="tabpanel"
|
||||||
aria-labelledby="{{ fieldset.title|slugify }}-tab">
|
aria-labelledby="custom-{{ fieldset.title|slugify }}-tab">
|
||||||
{% for field in fieldset.fields %}
|
{% for field in fieldset.fields %}
|
||||||
{% with field=form|get_field:field %}{{ field.as_field_group }}{% endwith %}
|
{% with field=form|get_field:field %}{{ field.as_field_group }}{% endwith %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
|
|
|
||||||
7
src/servala/static/js/bootstrap-tabs.js
vendored
7
src/servala/static/js/bootstrap-tabs.js
vendored
|
|
@ -3,22 +3,15 @@
|
||||||
(function() {
|
(function() {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
console.log("Loading bootstrap tab setup")
|
|
||||||
|
|
||||||
const initBootstrapTabs = () => {
|
const initBootstrapTabs = () => {
|
||||||
console.log("setting up bootstrap tabs")
|
|
||||||
const customTabList = document.querySelectorAll('#myTab button[data-bs-toggle="tab"]');
|
const customTabList = document.querySelectorAll('#myTab button[data-bs-toggle="tab"]');
|
||||||
console.log("found custom tabs", customTabList)
|
|
||||||
customTabList.forEach(function(tabButton) {
|
customTabList.forEach(function(tabButton) {
|
||||||
new bootstrap.Tab(tabButton);
|
new bootstrap.Tab(tabButton);
|
||||||
console.log("setting up custom tab", tabButton)
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const expertTabList = document.querySelectorAll('#expertTab button[data-bs-toggle="tab"]');
|
const expertTabList = document.querySelectorAll('#expertTab button[data-bs-toggle="tab"]');
|
||||||
console.log("found expert tabs", expertTabList)
|
|
||||||
expertTabList.forEach(function(tabButton) {
|
expertTabList.forEach(function(tabButton) {
|
||||||
new bootstrap.Tab(tabButton);
|
new bootstrap.Tab(tabButton);
|
||||||
console.log("setting up expert tab", tabButton)
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue