Nail/ipwhitelist-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.5.110: inline-редактирование через простые формы, без JS innerHTML

Browse Source
This commit is contained in:
naeel
2026-06-15 14:17:40 +04:00
parent 9ca0d087de
commit 6bff095a67
3 changed files with 11 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
views/v2/user.ejs
+9 -55
View File
@@ -220,14 +220,18 @@
</thead>
<tbody>
<% entries.forEach(function(e) { %>
<tr id="row-<%= e.id %>" data-cidr="<%= e.value_cidr %>" data-comment="<%= e.comment || '' %>" style="<%= e.deleted_at ? 'opacity:.5;text-decoration:line-through;' : '' %>">
<td id="cell-cidr-<%= e.id %>"><code><%= e.value_cidr %></code><% if (e.deleted_at) { %> <span style="font-size:.7rem;color:var(--red);">удалена</span><% } %></td>
<td id="cell-comment-<%= e.id %>"><%= e.comment || '—' %></td>
<tr style="<%= e.deleted_at ? 'opacity:.5;text-decoration:line-through;' : '' %>">
<td><code><%= e.value_cidr %></code><% if (e.deleted_at) { %> <span style="font-size:.7rem;color:var(--red);">удалена</span><% } %></td>
<td><%= e.comment || '—' %></td>
<td><%= e.created_by %></td>
<td><%= new Date(e.created_at).toLocaleString('ru') %></td>
<td id="cell-actions-<%= e.id %>" style="text-align:center;white-space:nowrap;">
<td style="text-align:center;white-space:nowrap;">
<% if (!e.deleted_at) { %>
<button class="btn btn-sm" onclick="editRow(<%= e.id %>)" title="Редактировать">✏️</button>
<form method="POST" action="/v2/app/edit/<%= e.id %>" style="display:inline;">
<input name="cidr" value="<%= e.value_cidr %>" size="18" style="padding:.2rem .4rem;border:1px solid var(--border);border-radius:4px;font-size:.82rem;">
<input name="comment" value="<%= e.comment || '' %>" size="18" style="padding:.2rem .4rem;border:1px solid var(--border);border-radius:4px;font-size:.82rem;">
<button class="btn btn-sm" title="Сохранить">✓</button>
</form>
<form method="POST" action="/v2/app/delete/<%= e.id %>" style="display:inline;">
<button class="btn btn-sm btn-danger" onclick="return confirm('Удалить?')" title="Удалить">🗑️</button>
</form>
@@ -243,56 +247,6 @@
</div>
<script>
function editRow(id) {
var row = document.getElementById('row-' + id);
var cidr = row.getAttribute('data-cidr');
var comment = row.getAttribute('data-comment');
document.getElementById('cell-cidr-' + id).innerHTML =
'<input type="text" id="inp-cidr-' + id + '" value="' + escHtml(cidr) + '" size="18" style="padding:.3rem .5rem;border:1px solid var(--blue);border-radius:4px;font-size:.82rem;">';
document.getElementById('cell-comment-' + id).innerHTML =
'<input type="text" id="inp-comment-' + id + '" value="' + escHtml(comment) + '" size="20" style="padding:.3rem .5rem;border:1px solid var(--blue);border-radius:4px;font-size:.82rem;">';
document.getElementById('cell-actions-' + id).innerHTML =
'<button class="btn btn-sm btn-primary" onclick="saveRow(' + id + ')" title="Сохранить">✓</button> ' +
'<button class="btn btn-sm" onclick="cancelEdit(' + id + ')" title="Отмена">✕</button>';
setTimeout(function() {
var inp = document.getElementById('inp-cidr-' + id);
if (inp) inp.focus();
}, 0);
}
function cancelEdit(id) {
var row = document.getElementById('row-' + id);
document.getElementById('cell-cidr-' + id).innerHTML =
'<code>' + escHtml(row.getAttribute('data-cidr')) + '</code>';
document.getElementById('cell-comment-' + id).innerHTML =
row.getAttribute('data-comment') || '—';
document.getElementById('cell-actions-' + id).innerHTML =
'<button class="btn btn-sm" onclick="editRow(' + id + ')" title="Редактировать">✏️</button> ' +
'<form method="POST" action="/v2/app/delete/' + id + '" style="display:inline;">' +
'<button class="btn btn-sm btn-danger" onclick="return confirm(\'Удалить?\')" title="Удалить">🗑️</button></form>';
}
function saveRow(id) {
var cidr = document.getElementById('inp-cidr-' + id).value;
var comment = document.getElementById('inp-comment-' + id).value;
var form = document.createElement('form');
form.method = 'POST';
form.action = '/v2/app/edit/' + id;
form.style.display = 'none';
var c = document.createElement('input'); c.name = 'cidr'; c.value = cidr; form.appendChild(c);
var m = document.createElement('input'); m.name = 'comment'; m.value = comment; form.appendChild(m);
document.body.appendChild(form);
form.submit();
}
function escHtml(s) {
return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
}
</script>
<footer style="text-align:right;padding:.5rem 1.5rem;font-size:.72rem;color:var(--muted);">v<%= version %></footer>
</body>
</html>