TAG
JavaScript
Result
Run
License
<h1>Favorite fruits</h1> <button type="button" id="btn-choice">Choice..</button> <ul id="list"></ul> <dialog id="mydialog"> <form id="fDialog" method="dialog"> <h3>Select favorite fruit</h3> <select id="favorite" required> <option>= Select =</option> <option value="Apple">Apple</option> <option value="Banana">Banana</option> <option value="Cheery">Cheery</option> <option value="Kiwi">Kiwi</option> <option value="Blueberry">Blueberry</option> </select> <p> <button type="submit" id="btn-submit">Select</button> </p> </form> </dialog>
window.addEventListener("load", () => { const elDialog = document.getElementById("mydialog"); document.getElementById("btn-choice").onclick = () => elDialog.showModal(); document.getElementById("fDialog").onsubmit = () => { let fruit = document.getElementById("favorite").value; document.getElementById("btn-submit").value = fruit; }; elDialog.onclose = (e) => { const elLi = document.createElement("li"); elLi.textContent = e.currentTarget.returnValue; document.getElementById("list").append(elLi); } });
Console
expand_less
License
License
by DevDic
Close