[ad_1]
Asked
Viewed
8 times
hello I’m working on a simple project where a user inputs the information and it goes into a table. I want the user to have the ability to put in the URL for an image and have it show up when the cell is made in the table. I have a button that prompts the user to input a URL but I cant figure out how to put that into an image tag inside the created cell.
let id = 0;
let img = document.getElementById("image").addEventListener("click", () => {
function getUrl() {
var url = prompt("Enter image URL");
if (url) {
return url;
} else {
return getUrl();
}
}
image.src = getUrl();
});
document.getElementById("add").addEventListener("click", () => {
let table = document.getElementById("list");
let row = table.insertRow(1);
row.setAttribute("id", `
test - $ {
id
}
`);
row.insertCell(0).innerHTML = document.getElementById("image").src = ""
row.insertCell(1).innerHTML = document.getElementById("Game-name").value;
row.insertCell(2).innerHTML = document.getElementById("hours-played").value;
row.insertCell(3).innerHTML = document.getElementById("new-critic-score").value;
row.insertCell(4).innerHTML = document.getElementById("new-personal-score").value;
let actions = row.insertCell(5);
actions.appendChild(createDeleteButton(id++));
document.getElementById("Game-name").value = "";
document.getElementById("hours-played").value = "";
document.getElementById("new-critic-score").value = "";
document.getElementById("new-personal-score").value = ""
});
function createDeleteButton(id) {
let btn = document.createElement("button");
btn.className = "btn btn-primary";
btn.id = id;
btn.innerHTML = "Delete";
btn.onclick = () => {
console.log(`
Deleting row with id: test - $ {
id
}
`);
let elementToDelete = document.getElementById(`
test - $ {
id
}
`);
elementToDelete.parentNode.removeChild(elementToDelete);
};
return btn;
}
Cruz Jr Garcia is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
1
default
[ad_2]