Within my company, I have designed a functional testing tool for our application using a combination of HTML, CSS, JavaScript, Node.js, Express, and Tablesorter. The test tool has been able to successfully execute various function tests.
The styling of my table is sourced from an open-source project called 'Tablesorter'.
https://i.sstatic.net/f8rBe.jpg
This particular segment serves as the edit screen, stored in .ejs format. Hence, the Node.js server dynamically renders this file into HTML.
However, I am facing challenges when attempting to add rows to the table. In search of a solution, I discovered the following approach:
for (var i in rList) {
var table = document.getElementById("ID_Table");
var row = table.insertRow(-1);
var cell1 = row.insertCell(-1);
var cell2 = row.insertCell(-1);
var list = rList[i].split(" ");
cell1.innerHTML = list[0];
cell2.innerHTML = list[1];
}
Unfortunately, this method falls short. The additional rows do not adhere to the 'tablesorter' style which poses a dilemma on how to resolve this issue.
https://i.sstatic.net/fiIqR.jpg
The applied 'tablesorter' style fails to encompass newly added rows, leaving me puzzled on the possible solutions.
<!-- Your customized HTML content goes here -->
This section showcases my personal .ejs File.
Further, presented below is the printResult Function found within indexCore.js:
function printResult(){
var rList = resultList.split('\n');
for (var i in rList) {
var table = document.getElementById("ID_Table");
var row = table.insertRow(-1);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var list = rList[i].split(" ");
cell1.innerHTML = list[0];
cell2.innerHTML = list[1];
}
}