var rows = document.querySelectorAll("table tr");
function createButton(iconClass, buttonText, clickHandler) {
var button = document.createElement("button");
var icon = document.createElement("i");
icon.className = iconClass;
button.appendChild(icon);
button.appendChild(document.createTextNode(buttonText));
button.onclick = clickHandler;
return button;
}
for (var i = 0; i < rows.length; i++) {
var row = rows[i];
var dropdown = document.createElement("select");
dropdown.className = "dropdown";
var firstOption = document.createElement("option");
var icon = document.createElement("i");
icon.className = "fas fa-ellipsis-v";
firstOption.appendChild(icon);
dropdown.add(firstOption);
var editButton = createButton("fas fa-edit", "編輯", function() {
var target = this.getAttribute("data-target");
window.location.href = target;
});
var cloneButton = createButton("fas fa-copy", "複製", function() {
var clonedRow = row.cloneNode(true);
row.parentNode.insertBefore(clonedRow, row.nextSibling);
});
var deleteButton = createButton("fas fa-trash-alt", "刪除", function() {
row.parentNode.removeChild(row);
});
var firstCell = row.cells[0];
firstCell.insertBefore(dropdown, firstCell.firstChild);
firstCell.appendChild(editButton);
firstCell.appendChild(cloneButton);
firstCell.appendChild(deleteButton);
var target = "http://example.com/edit/" + i;
editButton.setAttribute("data-target", target);
dropdown.onchange = function() {
var selectedOption = this.options[this.selectedIndex];
var selectedValue = selectedOption.value;
if (selectedValue == "edit") {
editButton.click();
} else if (selectedValue == "clone") {
cloneButton.click();
} else if (selectedValue == "delete") {
deleteButton.click();
}
};
}