I am in the process of creating an array structured like this var qwe = [[a,b],[c],[d]], where a and b serve as identifiers.
The values for a - d are being extracted from the DOM. Currently, my JavaScript code is functioning as intended, but I aim to merge similar arrays based on their identifiers. Running the code below results in:
qwe =[
[100,200],[3],[2],
[200, 300],[12],[4],
[100,200],[2],[6]
]
However, my goal is to combine the arrays with matching identifiers so that the final array appears as follows (based on the previous example):
qwe =[
[100,200],[5],[8],
[200, 300],[12],[4]
]
HTML
<table name="tab" id="tab">
<tr>
<th>ID</th>
<th>Location</th>
<th>Value</th>
<th>Other</th>
</tr>
<tr>
<td><input name="itinValue" value="100"></td>
<td><input name="location" value="200"></td>
<td><input name="num" value='3'></td>
<td><input name="other" value='2'></td>
</tr>
<tr>
<td><input name="itinValue" value="200"></td>
<td><input name="location" value="300"></td>
<td><input name="num" value='12'></td>
<td><input name="other" value='4'></td>
</tr>
<tr>
<td><input name="itinValue" value="100"></td>
<td><input name="location" value="200"></td>
<td><input name="num" value='2'></td>
<td><input name="other" value='6'></td>
</tr>
</table>
JavaScript
var table = document.querySelectorAll('[name="itinValue"]');
var qwe = [];
for(var i = 0; i < table.length; i++) {
var a = document.getElementsByName('itinValue')[i].value;
var b = document.getElementsByName('location')[i].value;
var c = document.getElementsByName('num')[i].value;
var d = document.getElementsByName('other')[i].value;
var x = [[a,b],[c],[d]];
//Compare, find, add logic goes here
//if identifiers do not exist
qwe.push(x);
}
This fiddle demonstrates my example and correctly outputs the HTML as well: https://jsfiddle.net/3oge7wxg/125/