blob: ae2513b244f4795611f52e25fdf4050485b87b4a (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
|
{% extends 'servers.html' %}
{% import "bootstrap/wtf.html" as wtf %}
{% set sidebar_state = 'disabled' %}
{% set btn_back = true %}
{% block nav_server_add %}active{% endblock %}
{% block content %}
<h2 class="mx-5 subhead-heading">{{_('Update server')}}</h2>
<form class="form mx-5" method="POST">
{{ form.hidden_tag() }}
{{ form.server_addr() }}
<div class="form-group">
<div id="ip-fields">
{% for addr in form.addr %}
<div class="d-flex align-items-center mb-2">
{{ addr(class="form-control me-2", placeholder=_("Enter IP Address"), required=True) }}
<button type="button" class="btn btn-danger" onclick="removeIPField(this)">{{_('Remove') }}</button>
</div>
{% endfor %}
</div>
<button type="button" class="btn btn-primary" onclick="addIPField()">{{_('Add address') }}</button>
{{ form.submit(class="btn btn-success") }}
</div>
</form>
<script>
function addIPField() {
const container = document.createElement('div');
container.classList.add('d-flex', 'align-items-center', 'mb-2');
const newField = document.createElement('input');
newField.setAttribute('type', 'text');
newField.setAttribute('name', 'addr-' + document.querySelectorAll('input[name^="addr-"]').length);
newField.classList.add('form-control', 'me-2');
newField.setAttribute('placeholder', '{{ _('Enter IP Address') }}');
newField.required = true;
const removeButton = document.createElement('button');
removeButton.setAttribute('type', 'button');
removeButton.classList.add('btn', 'btn-danger');
removeButton.innerText = '{{ _('Remove') }}';
removeButton.onclick = function() {
removeIPField(this);
};
container.appendChild(newField);
container.appendChild(removeButton);
document.getElementById('ip-fields').appendChild(container);
}
function removeIPField(elem) {
const ipFieldsContainer = document.getElementById('ip-fields');
const ipFieldDivs = ipFieldsContainer.querySelectorAll('.d-flex');
if (ipFieldDivs.length <= 1) {
return;
}
const parentDiv = elem.parentElement;
parentDiv.remove();
}
</script>
{% endblock %}
|
