popup.html 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <script>
  2. function showPopup2() {
  3. $.afui.popup({
  4. title: "Alert! Alert!",
  5. message: "This is a test of the emergency alert system!! Don't PANIC!",
  6. cancelText: "Cancel me",
  7. cancelCallback: function () {
  8. console.log("cancelled");
  9. },
  10. doneText: "I'm done!",
  11. doneCallback: function () {
  12. console.log("Done for!");
  13. },
  14. cancelOnly: false
  15. });
  16. }
  17. function showPopup3() {
  18. $.afui.popup({
  19. title: "Login",
  20. message: "Username: <input type='text' class='af-ui-forms'><br>Password: <input type='text' class='af-ui-forms' style='webkit-text-security:disc'>",
  21. cancelText: "Cancel",
  22. cancelCallback: function () {},
  23. doneText: "Login",
  24. doneCallback: function () {
  25. alert("Logging in")
  26. },
  27. cancelOnly: false
  28. });
  29. }
  30. </script>This creates a popup dialog to interact with users. You can pass in an HTML string, which acts (and replaces) an alert dialog. You can also pass in an object to get more interaction.
  31. <br>
  32. <br>
  33. <a class="button" data-alert data-message="I'm replacing an alert">Alert style diaglog</a>
  34. <br>
  35. <a class="button" onClick="showPopup2()">Detailed ineraction</a>
  36. <br>
  37. <a class="button" onClick="showPopup3()">HTML markup</a>
  38. <br>