select.html 852 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <title>wysiwyg-sceditor</title>
  6. <script src="../../dist/jsoneditor.js"></script>
  7. </head>
  8. <body>
  9. <textarea class="value" cols="30" rows="10"></textarea>
  10. <button class='get-value'>Get Value</button>
  11. <div class='container'></div>
  12. <script>
  13. var container = document.querySelector('.container');
  14. var value = document.querySelector('.value');
  15. var schema = {
  16. "type": "object",
  17. "properties": {
  18. "boolean": {
  19. "type": "boolean",
  20. "title": "Boolean!",
  21. "default": true
  22. }
  23. }
  24. };
  25. var editor = new JSONEditor(container, {
  26. schema: schema
  27. });
  28. document.querySelector('.get-value').addEventListener('click', function () {
  29. value.value = JSON.stringify(editor.getValue());
  30. console.log(editor.getValue());
  31. });
  32. </script>
  33. </body>
  34. </html>