2017-11-13 3 views
0

Ich überlege wahrscheinlich die Frage, aber wie starte ich einen Zähler neu? Wie Sie in meinem Code sehen, soll der Counter übereinstimmen, tut es aber nicht. Ich möchte, dass die Zelle einen gemeinsamen Wert der Zeile hat, in der sie sich befindet. Die Zellen der ersten Zeile sollten z. B. die ID: Zelle 0.0, Zelle 0.1 haben, aber sie haben eine Zeile übersprungen, bei der die erste Zahl eine Zeile voraus ist.JavaScript Neustart Counter

var rowCount = 0; 
 
var cellCount = 0; 
 

 
function appendRow(id, style) { 
 
    var table = document.getElementById(id); // table reference 
 
    length = table.length, 
 
    row = table.insertRow(table.rows.length); // append table row 
 
    row.setAttribute('id', style); 
 
    var i; 
 
    row.id = 'row' + rowCount; 
 
    rowCount++ 
 
    console.log(rowCount, cellCount); 
 
    // insert table cells to the new row 
 
    for (i = 0; i < table.rows[0].cells.length; i++) { 
 
    createCell(row.insertCell(i), i, 'cell ' + rowCount + '.' + cellCount); // doesn't start over once row changes 
 
    cellCount++ 
 
    } 
 
} 
 

 
function createCell(cell, text, style) { 
 
    var div = document.createElement('div'), // create DIV element 
 
    txt = document.createTextNode('_'); // create text node 
 
    div.appendChild(txt); // append text node to the DIV 
 
    div.setAttribute('id', style); // set DIV class attribute 
 
    div.setAttribute('idName', style); // set DIV class attribute for IE (?!) 
 
    cell.appendChild(div); // append DIV to the table cell 
 
}
table { 
 
    text-align: center; 
 
} 
 
td { 
 
    width: 100px; 
 
}
<button id="addCust" class="addSort" onclick="appendRow('custList')">add customer</button> 
 

 
<div class="custScroll"> 
 
    <table id="custListTop" contenteditable="false"> 
 
    <tr> 
 
     <td style="border-top-left-radius: 5px;">Customers</td> 
 
     <td style="border-top-right-radius: 5px;">Main Location</td> 
 
    </tr> 
 
    </table> 
 
    <table id="custList" contenteditable="true"> 
 
    <tr> 
 
     <td>Someone</td> 
 
     <td>something</td> 
 
    </tr> 
 
    </table> 
 
</div>

+0

Ihre Zellzähler geht doppelt so schnell, weil es doppelt so viele Zellen wie Zeilen in der Tabelle sind. – trincot

Antwort

1

Ich bin mir nicht sicher, das ist, was Sie wollen, aber wenn Sie rowCount++ nach der for-Schleife setzen beginnt es das erste Element bei 0 erhöht dann von dort aus.

Wenn Sie wollen, dass die Zellen über beginnen dann createCell ändern i zu verwenden, anstatt ZellenZaehler:

createCell(row.insertCell(i), i, 'cell ' + rowCount + '.' + i); 
+0

wow ... definitiv übertrieben – hannacreed