remove port button

This commit is contained in:
mouriermaxime
2023-01-20 23:57:26 +01:00
parent d8d81c8f42
commit 666c52f419

View File

@@ -107,7 +107,7 @@
`<label for="volume_name_${volume_cpt}">Nom du volume :</label>
<input type="text" name="volume_name_${volume_cpt}" id="volume_name_${volume_cpt}" required>
<label for="volume_container_${volume_cpt}">Container's directory :</label>
<input type="text" name="volume_container_${volume_cpt}" id="volume_container_${volume_cpt}" required><br>
<input type="text" name="volume_container_${volume_cpt}" id="volume_container_${volume_cpt}" required>
<button type="button" onclick="remove_volume(${volume_cpt})">Supprimer</button><br>`;
document.getElementById("volumes").appendChild(new_volume_div)
document.getElementById('volume_cpt').value = volume_cpt;
@@ -156,12 +156,47 @@
function add_port() {
port_cpt+=1;
var new_port_div = document.createElement('div')
new_port_div.setAttribute("id",`port-${port_cpt}`)
new_port_div.innerHTML +=
`<label for="port_${port_cpt}">Service port :</label>
<input type="text" name="port_${port_cpt}" id="port_${port_cpt}" required><br>
<input type="text" name="port_${port_cpt}" id="port_${port_cpt}" required>
<button type="button" onclick="remove_port(${port_cpt})">Supprimer</button><br>`;
document.getElementById("ports").appendChild(new_port_div)
document.getElementById('port_cpt').value = port_cpt;
}
function remove_port(index){
var port_to_rm = document.getElementById(`port-${index}`);
var cpt = document.getElementById('port_cpt').value -1;
port_to_rm.remove();
document.getElementById('port_cpt').value = cpt;
update_port_ids();
}
function update_port_ids() {
const port_divs = document.querySelectorAll('[id^="port-"]');
for (let i=0; i < port_divs.length; i++) {
port_divs[i].setAttribute('id',`port-${i+1}`)
let port_labels = port_divs[i].querySelectorAll('[for^=port_]');
var labels = [{"liste":port_labels,"for_name":"port_"}];
for(let x=0; x < labels.length; x++){
for (let j=0; j < labels[x].liste.length; j++) {
labels[x].liste[j].setAttribute("for",`${labels[x].for_name}${i+1}`);
}
}
let port_inputs = port_divs[i].querySelectorAll('[name^=port_]');
var inputs = [{"liste":port_inputs,"name":"port_"}]
for(let x=0; x < inputs.length; x++){
for (let j=0; j < inputs[x].liste.length; j++) {
inputs[x].liste[j].setAttribute("name",`${inputs[x].name}${i+1}`);
inputs[x].liste[j].setAttribute("id",`${inputs[x].name}${i+1}`);
}
}
let bouton = port_divs[i].querySelector("button");
bouton.setAttribute("onclick",`remove_port(${i+1})`);
}
}
</script>
</html>