Wapp

Check-in [ab89ab225b]
Login

Many hyperlinks are disabled.
Use anonymous login to enable hyperlinks.

Overview
Comment:Improvements to the tableajax01.tcl example.
Downloads: Tarball | ZIP archive
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA3-256: ab89ab225b051a15e9e044a80b42daca261bcc41e0fe141521bc5d630ea332e3
User & Date: drh 2019-04-23 19:52:34.906
Context
2019-04-30
16:56
Add the wapptest.tcl script from SQLite to the list of real-world usage examples. (check-in: b25a28b219 user: drh tags: trunk)
2019-04-23
19:52
Improvements to the tableajax01.tcl example. (check-in: ab89ab225b user: drh tags: trunk)
19:35
Add a "self" page to the fileupload.tcl demo. (check-in: cdd099b81e user: drh tags: trunk)
Changes
Side-by-Side Diff Ignore Whitespace Patch
Changes to examples/tableajax01.tcl.

1
2
3
4
5
6

7
8




9












10

11
12
13
14
15
16
17
18
19
20
21
22
23





24
25
26
27
28
29
30
1
2
3
4
5
6

7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

27
28
29
30
31
32
33
34
35
36
37
38
39

40
41
42
43
44
45
46
47
48
49
50
51
+





-
+


+
+
+
+

+
+
+
+
+
+
+
+
+
+
+
+
-
+












-
+
+
+
+
+







#!/usr/bin/wapptclsh
# This script demonstrates how to receive bulk HTML content
# (such as a complete <table>) and insert it in the middle
# of the DOM using XMLHttpRequest
#
package require wapp
proc wapp-default {} {
proc common-header {} {
  wapp-trim {
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link href="%url([wapp-param SCRIPT_NAME]/style.css)" rel="stylesheet">
    <body>
  }
}
proc common-footer {} {
  wapp-trim {
    </body>
    </html>
  }
}

proc wapp-default {} {
  common-header
  wapp-trim {
    <p>This application demonstrations how to use XMLHttpResult to obtain
    <p>This application demonstrates how to use XMLHttpResult to obtain
    bulk HTML text (such as a large &lt;table&gt;) and then insert that
    text in the middle of the DOM.</p>

    <div id="insertionPoint"></div>

    <p><form id="theForm">
    Click the button 
    <input type="submit" id="theButton" value="Click Here">
    to cause content to be inserted above this paragraph and below
    the initial paragraph
    </form></p>
    <script src='%url([wapp-param SCRIPT_NAME]/script.js)'></script>
  }

    <p><a href='%html([wapp-param SCRIPT_NAME])/self'>Show the Wapp script
    that generates this page</a></p>
  }
  common-footer
}

# This is the javascript that takes control of the form and causes form
# submissions to fetch and insert HTML text.
#
proc wapp-page-script.js {} {
  wapp-mimetype text/javascript
60
61
62
63
64
65
66


























67
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114







+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

    <tr><th>Column 1<th>Column 2<th>Column 3
    <tr><td>1.1<td>1.2<td>1.3
    <tr><td>2.1<td>2.2<td>2.3
    <tr><td>%html($counter)<td><td><button id="insCancel">Cancel</button>
    </table>
  }
}

# The /self page that shows the text of this script.
#
proc wapp-page-self {} {
  wapp-cache-control max-age=3600
  common-header
  set fd [open [wapp-param SCRIPT_FILENAME] rb]
  set script [read $fd]
  close $fd
  wapp-trim {
    <h1>Wapp Script That Shows A Copy Of Itself</h1>
    <pre>%html($script)</pre>
  }
  common-footer
}
proc wapp-page-style.css {} {
  wapp-mimetype text/css
  wapp-cache-control max-age=3600
  wapp-trim {
    pre {
       border: 1px solid black;
       padding: 1ex;
    }
  }
}

wapp-start $argv