Javascript - Inject HTML into popup window


SUBMITTED BY: Guest

DATE: Oct. 24, 2013, 7:44 p.m.

FORMAT: JavaScript

SIZE: 3.5 kB

HITS: 1274

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1...
  3. <html>
  4. <head>
  5. <title>Don's Digital Photo Development</title>
  6. <script type="text/javascript">
  7. var todayDate = new Date();
  8. function loadDate() {
  9. todayDate = new Date();
  10. var month = todayDate.getMonth() + 1;
  11. var day = todayDate.getDate();
  12. var year = todayDate.getFullYear();
  13. currentDate = month + "/" + day + "/" + year;
  14. document.getElementById("date").value = currentDate;
  15. }
  16. function orderReady(days) {
  17. var pickupDate = (todayDate.getMonth() + 1) + '/' +
  18. (todayDate.getDate() + Number(days)) + '/' +
  19. (todayDate.getFullYear());
  20. document.getElementById('pickup').value = pickupDate;
  21. }
  22. function Open_win() {
  23. var name = document.getElementsByName('firstName')[0].value + ' ' +
  24. document.getElementsByName('lastName')[0].value;
  25. var phone = document.getElementsByName('phone')[0].value;
  26. var radio = document.getElementsByName('itemType');
  27. var order = '';
  28. for (i = 0; i < radio.length; i++) {
  29. if (radio[i].checked)
  30. order = radio[i].title;
  31. }
  32. var date = document.getElementById('date').value;
  33. var pickup = document.getElementById('pickup').value;
  34. var popup = window.open("",
  35. "_blank",
  36. "width=400, height=300, menubar=yes, toolbar=yes");
  37. popup.document.writeln("<html><head><title>Order Receipt</title></head>" +
  38. "<body>" +
  39. "<h1>Order Receipt</h1>" +
  40. "<b>Name:</b>" + name + "<br />" +
  41. "<b>Telephone:</b>" + phone +
  42. "<p><b>Order:</b>" + order + "<br />" +
  43. "<b>Order Date :</b>" + date + "<br />" +
  44. "<b>Pickup Date:</b>" + pickup +
  45. "</body></html>");
  46. popup.document.close();
  47. }
  48. </script>
  49. </head>
  50. <body onload="loadDate();">
  51. <form>
  52. <h1>Don's Digital Photo Development</h1>
  53. <p>
  54. First Name: <br /><input type="text" name="firstName" size="50" value="" /><br />
  55. Last Name: <br /><input type="text" name="lastName" size="50" value="" /><br />
  56. Telephone: <br /><input type="text" name="phone" size="50" value="" />
  57. </p>
  58. <p>
  59. Items
  60. <input type="radio" name="itemType" value="1" title="5 x 7 Prints"
  61. onclick="orderReady(this.value)"/>5 x 7 Prints(1 day)
  62. <input type="radio" name="itemType" value="1" title="Poster"
  63. onclick="orderReady(this.value)"/>Poster (1 day)
  64. <input type="radio" name="itemType" value="2" title="Coffee Mug"
  65. onclick="orderReady(this.value)"/>Coffee Mug (2 Days)
  66. <input type="radio" name="itemType" value="3" title="T-shirt"
  67. onclick="orderReady(this.value)"/>T-shirt (3 days)
  68. </p>
  69. <p>
  70. Today's Date: <input type="text" id="date" name="orderdate" size="50"/><br />
  71. Pick-up Date: <input type="text" id="pickup" name="pickupdate" size="50"/>
  72. </p>
  73. <input type="submit" value="Place Order" onclick="Open_win()"/>
  74. </form>
  75. </body>
  76. </html>

comments powered by Disqus