Új hozzászólás Aktív témák

• btz addikt

  #7871

  #7870 martonx

  2020-05-16 22:18:39

  Új Válasz

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  

  btz

  addikt

  #7870 martonx

  #7870 martonx

  Már hogy a fenébe ne lehetne? https://www.w3schools.com/howto/howto_css_modals.asp

  Az oké is volt számomra, ez a link már a könyvjelzőim között volt modal témában, de nekem pontosan az kellett, hogy a benne lévő input értékek a data szertint változzanak. Erre találtam, is megoldást JQueryset, de mivel kerülöm ezért akartam simple Javascriptesíteni.

  De időközben rajta voltam a témán és ezt sikerült megalkotnom
  <button onclick="myFunction(this)" data-book-id="123" data-book-name="Test Book 1">Open Popup Book1</button><br />
<button onclick="myFunction(this)" data-book-id="456" data-book-name="Test Book 2">Open Popup Book2</button><br />
<button onclick="myFunction(this)" data-book-id="789" data-book-name="Test Book 3">Open Popup Book3</button><br />
<br /> <br />

<script>
function myFunction(thisbook) {
var bkID = thisbook.getAttribute("data-book-id");
var bkNam = thisbook.getAttribute("data-book-name");
document.getElementById("myBookId").value = bkID;
document.getElementById("myBookName").value = bkNam;
document.getElementById("book-update-popup").style.display = "block";
}

function closeBookModal() {
document.getElementById("book-update-popup").style.display = "none";
}
</script>

<div id="book-update-popup" style="display: none; margin: 5px; padding: 10px; border: 1px solid;">
BookID: <input type="text" id="myBookId" value="">
BookName: <input type="text" id="myBookName" value="">
<br /><br />
<button onclick="closeBookModal()">Close</button><br />
</div>

  Jsfiddle demo

Új hozzászólás Aktív témák