Complete functionality of add, delete btns

SalamLang · Nov 30, 2024 · 13bb793 · 13bb793
1 parent da1eb8a
commit 13bb793
Showing 1 changed file with 20 additions and 19 deletions.
diff --git a/config/admin/templates/edit.html b/config/admin/templates/edit.html
@@ -33,12 +33,13 @@ <h1>Edit File: {{ filename }}</h1>
                         <td>
                             {% if column in item %}
                                 {% if column == "text" %}
-                                    <table class="{{ column }}-inputs languages w-100">
-                                        {% for lang in languages %}
+                                    {% for lang in languages %}
+                                        <table class="languages-{{ lang }} languages w-100">
                                             {% if item[column][lang] is string %}
                                                 <tr>
-                                                    <td>
+                                                    <td class="d-flex justify-content-between align-items-center">
                                                         <strong class="language-title">{{ lang }}</strong>
+                                                        <button class="btn btn-primary btn-sm" onclick="addLanguageInput(this, '{{ lang }}')">Add</button>
                                                     </td>
                                                 </tr>
                                                 <tr>
@@ -47,11 +48,6 @@ <h1>Edit File: {{ filename }}</h1>
                                                         <button class="btn btn-danger btn-sm" onclick="deleteLanguageInput(this, '{{ lang }}')">Delete</button>
                                                     </td>
                                                 </tr>
-                                                <tr>
-                                                    <td class="d-flex justify-content-end align-items-end">
-                                                        <button class="btn btn-primary btn-sm" onclick="addLanguageInput(this, '{{ lang }}')">Add</button>
-                                                    </td>
-                                                </tr>
                                             {% elif item[column][lang] is iterable %}
                                                 {% if item[column][lang]|length == 0 %}
                                                     <tr>
@@ -62,8 +58,9 @@ <h1>Edit File: {{ filename }}</h1>
                                                     </tr>
                                                 {% else %}
                                                     <tr>
-                                                        <td>
+                                                        <td class="d-flex justify-content-between align-items-center">
                                                             <strong class="language-title">{{ lang }}</strong>
+                                                            <button class="btn btn-primary btn-sm" onclick="addLanguageInput(this, '{{ lang }}')">Add</button>
                                                         </td>
                                                     </tr>
                                                     {% for val in item[column][lang] %}
@@ -74,11 +71,6 @@ <h1>Edit File: {{ filename }}</h1>
                                                             </td>
                                                         </tr>
                                                     {% endfor %}
-                                                    <tr>
-                                                        <td>
-                                                            <button class="btn btn-primary btn-sm" onclick="addLanguageInput(this, '{{ lang }}')">Add</button>
-                                                        </td>
-                                                    </tr>
                                                 {% endif %}
                                             {% else %}
                                             <tr>
@@ -90,8 +82,8 @@ <h1>Edit File: {{ filename }}</h1>
                                                     </td>
                                                 </tr>
                                             {% endif %}
-                                        {% endfor %}
-                                    </table>
+                                        </table>
+                                    {% endfor %}
                                 {% else %}
                                     <input class="form-control" value="{{ item[column] }}">
                                 {% endif %}
@@ -113,11 +105,20 @@ <h1>Edit File: {{ filename }}</h1>
 
     <script>
         function addLanguageInput(elm, lang) {
+            const table = elm.closest('table');
 
+            const newInputRow = document.createElement('tr');
+            newInputRow.innerHTML = `<td class="language-item d-flex">
+                <input class="form-control" value="">
+                <button class="btn btn-danger btn-sm" onclick="deleteLanguageInput(this, '${lang}')">Delete</button>
+            </td>`;
+
+            table.appendChild(newInputRow);
         }
 
         function deleteLanguageInput(elm, lang) {
-
+            const row = elm.closest('tr');
+            row.remove();
         }
 
         function addText(column, button) {
@@ -157,9 +158,9 @@ <h1>Edit File: {{ filename }}</h1>
             const items = Array.from(rows).map(row => {
                 const cells = row.querySelectorAll('input');
                 const item = {};
+                let values = [];
                 {% for column in columns %}
-                    const inputs = row.querySelectorAll(`.${column}-inputs input`);
-                    const values = Array.from(inputs).map(input => input.value);
+                    values = Array.from(row.querySelectorAll(`.${column}-inputs input`)).map(input => input.value);
                     item["{{ column }}"] = values.length > 1 ? values : values[0];
                 {% endfor %}
                 return item;