add user button fixed

This commit is contained in:
2025-03-28 16:47:54 -04:00
parent 728061c504
commit a7679663cc

View File

@@ -20,7 +20,13 @@
<td><input type="text" id="mac_address-{{ user.mac_address }}" value="{{ user.mac_address }}"></td>
<td><input type="text" id="description-{{ user.mac_address }}" value="{{ user.description }}"></td>
<td>
<input type="text" id="vlan_id-{{ user.mac_address }}" value="{{ user.vlan_id }}">
<select id="vlan_id-{{ user.mac_address }}">
{% for group in groups %}
<option value="{{ group.groupname }}" {% if user.vlan_id == group.groupname %} selected {% endif %}>
{{ group.groupname }}
</option>
{% endfor %}
</select>
</td>
<td>
<button onclick="updateUser('{{ user.mac_address }}')"></button>
@@ -120,14 +126,14 @@
function updateUser(mac_address) {
const description = document.getElementById('description-' + mac_address).value;
const vlan_id = document.getElementById('vlan_id-' + mac_address).value;
const mac_address_input = document.getElementById('mac_address-' + mac_address).value;
const mac_address_input = document.getElementById('mac_address-' + mac_address).value; //added
fetch('/update_user', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: `mac_address=${mac_address}&description=${description}&vlan_id=${vlan_id}&new_mac_address=${mac_address_input}`
body: `mac_address=${mac_address}&description=${description}&vlan_id=${vlan_id}&new_mac_address=${mac_address_input}` //added new param
})
.then(response => response.text())
.then(data => {
@@ -151,6 +157,8 @@
}
}
function duplicateUser(mac_address) {
fetch('/duplicate_user', {
method: 'POST',
@@ -185,6 +193,8 @@
</td>
</tr>`;
newTable += `<tr>
<td colspan="3" class="merged-cell">
<button onclick="addDuplicatedUserRow(this)"></button>
@@ -206,18 +216,20 @@
function saveDuplicatedUser() {
let rows = document.querySelectorAll('#duplicate-dialog-content table tbody tr');
let new_mac_address = rows[0].querySelector('#new-mac').value;
let new_mac_address = rows[0].querySelector('#new-mac').value; //changed
let attributes = [];
for (let i = 1; i < rows.length - 1; i++) {
const descriptionInput = rows[i].querySelector(`.new-description`);
const vlanIdInput = rows[i].querySelector(`.new-vlan_id`);
if (descriptionInput && vlanIdInput) {
attributes.push({
description: descriptionInput.value,
vlan_id: vlanIdInput.value,
});
} else {
console.warn(`Input elements not found for row ${i}`);
return;
}
@@ -228,7 +240,7 @@
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ mac_address: new_mac_address, attributes: attributes })
body: JSON.stringify({ mac_address: new_mac_address, attributes: attributes }) //changed
})
.then(response => response.text())
.then(data => {
@@ -242,14 +254,18 @@
}
function addDuplicatedUserRow(button) {
const table = button.parentNode.parentNode.parentNode;
const table = button.parentNode.parentNode.parentNode; //get the table
const newRow = table.insertRow(table.rows.length - 1);
const cell1 = newRow.insertCell(0);
const cell2 = newRow.insertCell(1);
const cell3 = newRow.insertCell(2);
const cell4 = newRow.insertCell(3);
cell1.classList.add('merged-cell');
cell2.innerHTML = `<input type="text" class="new-description" value="">`;
cell3.innerHTML = `<select class="new-vlan_id">
@@ -271,7 +287,7 @@
document.getElementById('add-user-dialog').showModal();
}
document.getElementById('close-add-user-dialog').addEventListener('click', () => {
document.getElementById('cancel-add-user-dialog').addEventListener('click', () => {
document.getElementById('add-user-dialog').close();
});
@@ -291,38 +307,41 @@
// Construct the data as an object
const userData = {
username: mac, // Use MAC as username
password: mac, // Use MAC as password
mac_address: mac,
description: description,
vlan_id: vlan_id
};
fetch('/add_user', {
fetch('/add_user', { // Make sure this URL is correct
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Content-Type': 'application/json', // Set the content type to JSON
},
body: JSON.stringify(userData),
body: JSON.stringify(userData), // Send the data as a JSON string
})
.then(response => {
if (!response.ok) {
// Handle HTTP errors (e.g., 400, 500)
return response.text().then(text => {
throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
});
}
return response.json();
return response.json(); // Expect JSON response from server
})
.then(data => {
console.log("Server response:", data);
if (data && data.success) {
if (data && data.success) { // Check for success property in JSON response
document.getElementById('add-user-dialog').close();
location.reload();
} else {
alert('Error adding user: ' + (data && data.message ? data.message : 'Unknown error'));
alert('Error adding user: ' + (data && data.message ? data.message : 'Unknown error')); // Show error from server or a generic message
}
})
.catch(error => {
console.error('Fetch error:', error);
alert('Error adding user: ' + error.message);
console.error('Fetch error:', error); // Log the error for debugging
alert('Error adding user: ' + error.message); // Show a user-friendly error message
});
}
</script>