Continued faction rank system

Client/FactionManagement/Ranks/script.js

@@ -1,11 +1,52 @@
-$(document).ready(function () {
+/**
+ * @overview Life of German Reallife - Faction Manager Rank (script.js)
+ * @author hydrant
+ * @copyright (c) 2008 - 2018 Life of German
+ */
+
+$(document).ready(function () {
     mp.trigger("onManageFactionRanksLoaded");
-    $("table#rank-table").append("<tr><td>neues</td><td>element</td></tr>");
+
+    $(".save-btn").click(function () {
+        var rows = $("table#rank-table tr");
+        console.log(rows);
+        rows.shift();
+        console.log(rows);
+
+        if (rows.length == 0) {
+            alert("Es muss mindestens ein Rang angegeben werden!");
+            return;
+        }
+
+        var rankArray = new Array();
+
+        rows.forEach(function (row) {
+            var tdId = row[0];
+            var tdName = row[1];
+
+            var id = tdId.children[0].value;
+            var name = tdName.children[0].value;
+
+            var rank = [id, name];
+            console.log(rank);
+            rankArray.push(rank);
+        });
+
+        console.log(rankArray);
+        //mp.trigger('saveFactionRankData');
+    });
 });
 
 function loadData(rankData) {
-    var obj = JSON.parse(rankData);
-    obj.forEach(function (rank) {
-        $("table#rank-table").append(rank);
+    $("table#rank-table tr").remove();
+    $("table#rank-table").append("<tr class='nodrop nodrag'><th style='display:none;'>ID</th><th>Fraktions-Ränge</th></tr>");
+
+    console.log(rankData);
+    rankData.forEach(function (rank) {
+        $("table#rank-table").append("<tr><td style='display:none;'><input disabled class='input-id' value='" + rank.Id + "' /></td><td><input class='input-rankname' value='" + rank.RankName + "' /></tr>");
+    });
+
+    $("table#rank-table").tableDnD({
+        onDragClass: "rankDnD"
     });
 }