• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Mehrdimensionales Array sortieren

B

BetaOps

Neues Mitglied
Guten Tag liebe Community,

ich wollte fragen wie genau man ein zwei dimensionales Array anhand sortiert.
Um genauer zu sein soll im Array[x][y] das x anhand der Daten im y sortiert werden

Array[0][23123,AB:SJ:56:78:12:95]
Array[1][1234,FF:FF:FF:FF:FF:FF]

jetzt weiß ich nicht wie ich die x stelle anhand der zweiten y stelle sortieren soll

Hier mein Code:

HTML: 
<!-- HTML Auschnitt -->
<table>
            <thead>
                <tr>
                    <td>X</td>
                    <td id="cellHead">Seriennummer <span id="srnnmmr" class="clckableSpn"><i id="srnnmmrFont" class="fas fa-arrow-up"></i></span></td>
                    <td id="cellHead">MAC <span id="mc" class="clckableSpn"><i class="fas fa-arrow-up"></i></span></td>
                    <td id="cellHead">Hersteller <span id="hrstllr" class="clckableSpn"><i class="fas fa-arrow-up"></i></span></td>
                    <td id="cellHead">Kauf Datum <span id="kfDtm" class="clckableSpn"><i class="fas fa-arrow-up"></i></span></td>
                    <td id="cellHead">Hostname <span id="hstnme" class="clckableSpn"><i class="fas fa-arrow-up"></i></span></td>
                    <td id="cellHead">Typ <span id="typ" class="clckableSpn"><i class="fas fa-arrow-up"></i></span></td>
                    <td>Software Version</td>
                    <td>Wartung</td>
                    <td>Beschreibung</td>
                    <td>Bemerkung</td>
                </tr>
            </thead>
            <tbody id="tableData">
                <tr class="rowData" id="r1">
                    <td class="cellData" id="r1t1">X</td>
                    <td class="cellData" id="r1t2">84564153</td>
                    <td class="cellData" id="r1t3">FF:FF:AA:CC:DD:EE</td>
                    <td class="cellData" id="r1t4">Siemens</td>
                    <td class="cellData" id="r1t5">12.1.2019</td>
                    <td class="cellData" id="r1t6">Host1</td>
                    <td class="cellData" id="r1t7">typ1</td>
                    <td>/</td>
                    <td>/</td>
                    <td>/</td>
                    <td>/</td>
                </tr>
Javascript: 
// Mein JS Code

// aCount ist der die anzahl der cellhead damit nicht alle cellData in ein Arrayfeld kommen
if (aCount == 0) {
    // Array mit Daten füllen
    for (var index = 0 ; index < rows.length; index++) {
        a[index] = [];
        console.log("Array 1: ");
        for (aCount; aCount < cellsHead.length; aCount++) {
            a[index][index2].push(rows[index].id);
            a[index][index2].push(cells[index2].textContent);
            console.log("Array 12: " + a[index][index2]);
        }
    }
    aCount = 0;
}
    
    

// Sortieren Funktion
// Es soll die erste Diemension anhand der Daten der Zweiten Dimension sortiert werden
function srt() {
    let varSwtich = this.parentNode.textContent; // clckableSpn hat ein click eventlistener 
    switch(varSwtich){
        case "Seriennummer":
            var a2 = a;
            if (a2.sort().toString == a.toString) { // falls es schon soritert ist soll es reversed werden 
                a.reverse(); // wird hier jetzt beide Dimensionen sortiert oder nur die erste ?
                srnnmmrFont.class = "fas fa-arrow-up"; // außerdem soll sich das icon ändern
            } else {
                a.sort();
                srnnmmrFont.class = "fas fa-arrow-down";
            }
            break;
        case "MAC":
            break;
        default:
            break;
    }
}
 
Alles klar vielen Dank!!!
Funktioniert es mit numerischen und alphanumerischen Daten gleichermaßen ?
Und könntest du mir vielleicht ein Ansatz geben wie ich am besten die Tabelle anhand der Daten im Array sortieren soll?
das unten kann so nicht ganz funktionieren weil sobald aCount zu groß ist direkt aus der zweiten forschleife gesprungen wird, aber ich hab keine Ahnung wie ich des sonst machen soll

Ich würde es so machen :

Javascript: 
// Sortieren Funktion
// Es soll die erste Diemension anhand der Daten der Zweiten Dimension sortiert werden
function srt() {
    let varSwtich = this.parentNode.textContent;
    switch(varSwtich){
        case "Seriennummer":
            var a2 = a;
            if (a2.sort().toString == a.toString) { // muss ich noch deinem Code anpassen
                if (aCount == 0) {
                    for (var index = 0 ; index < cellHead.length; index++) {
                        // cellhead benutze ich nur damit ich die zeilen beim zugriff unterscheiden kann
                        // wegen der Nodelist : var cells = document.getElementsByClassName("cellData");
                        for (aCount; aCount < a[index].length; aCount++) {
                            // hier dann auf die Tabellenzelle (td:cells) zugreifen und mit dem inhtalt vom array füllen
                            // acount benutze ich nur weil ich ja alle td in einer Nodelist
                            // habe und die nicht direkt einer zeile zu geordnet habe
                            // also nach dem die Zweite for schleife fertig wäre müsste ich irgendwie auf größere td's zugreifen
                        }
                    }
                    aCount = 0;
                }
                srnnmmrFont.class = "fas fa-arrow-up";
            } else {
                a.sort();
                srnnmmrFont.class = "fas fa-arrow-down";
            }
            break;
}


Bearbeitet:
Theoretisch kann ich die Nodelist in ein Array tun und damit dann einfacher die for-schleifen durchlaufen und neu zuweisen oder nicht ? :s
Also ich frage nur so dumm weil mein ganzer Code nicht funktioniert, keine Errors und auch keine Konsolen ausgaben
 
Vielen Dank du rettest mich <3 !
Da ich noch nie jQuery benutzt habe muss ich dich leider fragen wie ich es jetzt einbinde
Also jQuery in mein projekt einbinden und danach die obrigen Files einbinden, danach Features enablen und fertig oder ?
Bearbeitet:
Es hat funktioniert vielen Dank!!!!!!!!!!!
 
Zuletzt bearbeitet:
Sempervivum schrieb:
Nicht benötigte Features können wegkonfiguriert werden:

DataTables example - Feature enable / disable

datatables.net datatables.net
Zum Vergrößern anklicken....

Kannst du mir vielleicht verraten wie ich die Such-und Sortierungsfunkion in den spalten ausschalte, die Referenz gibt mir mehr fragen als antworten

Javascript: 
 $('#tableData').dataTable({
            "columns": [
              { "searchable": false,
                "orderable": false, "targets": 0},
              null,
              null,
              null,
              null
            ]
        });
Da stand dass ich im Array jede spalte trotzdem eintragen muss, aber wenn ich es wie oben beschrieben mache funktioniert es nicht
Ich kann mir schon denken dass jedes Null eine Spalte repräsentiert und aber welche ID muss ich benutzen oder muss ich erst den spalten eine ID zuweisen ?
 
Meinst du mit Such auch das Suchfeld ?
So ist das Suchfeld weg und wenn man oben auf die Spalten klickt werden die nicht mehr Sortiert
Code: 
$('#tableData').dataTable({
           searching: false,
           ordering: false
});
Meinst du das so
 
genau, aber nur bei ein paar Spalten. In der Doku stand drin dass ich Null für jede spalte eintragen soll damit das Array mit dem befehl umgehen kann
Ich hab es versucht mit dem obigen Code (von mir) aber es hat sich nichts verändert ....
Muss ich es beim initialisieren machen ?
Also ungefähr so

Javascript: 
$(document).ready( function () {
            $('#dataTable').DataTable({
            "columns": [
              { "searchable": false,
                "orderable": false, "targets": 0},
              null,
              null,
              null,
              null
            ]
        });
        } );
 
Zuletzt bearbeitet:
Ja ich wollte die Sortierfunktion nur in einer Spalte aufheben, weil diese ein Button Bearbeiten enthalten soll
Es Funktioniert aber bei mir leider nicht :s
Ich hab mal einfach mal ein Bild eingefügt
5213
 
Leider kenne ich keine Möglichkeit es online zu stellen, deshalb hier der Code

Javascript: 
// Das habe ich benutzt zum Konfigurieren

$(document).ready(function () {
            $('#tableData').DataTable();
        });
        $('#tableData').dataTable({
            "columns": [
              null,
              {
                  "searchable": false,
                  "orderable": false, "targets": 0
              },
            ]
        });
und dann eine Zwei Spalten Tabelle

HTML: 
<div style="overflow-x:scroll;width:500px;">
    <table id="tableData" class="display">
        <thead>
            <tr>
                <td>Seriennummer</td>
                <td id="BearbeitenCol"></td>
            </tr>
        </thead>
        <tbody >

            <tr class="rowData" id="r1">
                <td class="cellData" id="r1t1">84564153</td>
                <td class="cellData" id="r1t2">X</td>
            </tr>

            <tr class="rowData" id="r2">
                <td class="cellData" id="r2t1">55415741</td>
                <td class="cellData" id="r2t2">X</td>
            </tr>
        </tbody>
    </table>
</div>
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben