Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(62)

Side by Side Diff: src/site/docs/tutorials/forms/index.markdown

Issue 27070003: removing links to github in favor of downloading a zipfile from github (Closed) Base URL: https://github.com/dart-lang/dartlang.org.git@master
Patch Set: Created 7 years, 2 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 --- 1 ---
2 layout: default 2 layout: default
3 title: "Get Input from a Form" 3 title: "Get Input from a Form"
4 description: "Using HTML forms and input elements to send data to a server" 4 description: "Using HTML forms and input elements to send data to a server"
5 has-permalinks: true 5 has-permalinks: true
6 tutorial: 6 tutorial:
7 id: forms 7 id: forms
8 next: indexeddb/ 8 next: indexeddb/
9 next-title: "Use IndexedDB" 9 next-title: "Use IndexedDB"
10 prev: fetchdata/ 10 prev: fetchdata/
11 prev-title: "Fetch Data Dynamically" 11 prev-title: "Fetch Data Dynamically"
12 --- 12 ---
13 13
14 {% capture whats_the_point %} 14 {% capture whats_the_point %}
15 15
16 * Use forms with inputs to gather data from a user. 16 * Use forms with inputs to gather data from a user.
17 * Send data to the server, declaratively or programmatically. 17 * Send data to the server, declaratively or programmatically.
18 * Get the response from the server with HttpRequest. 18 * Get the response from the server with HttpRequest.
19 * Handle communication asynchronously with Futures. 19 * Handle communication asynchronously with Futures.
20 * Use HttpServer to set up a server to listen on a port and host. 20 * Use HttpServer to set up a server to listen on a port and host.
21 * Use CORS headers to set access permissions for each request. 21 * Use CORS headers to set access permissions for each request.
22 * Use Polymer data binding to sync form data and Dart data. 22 * Use Polymer data binding to sync form data and Dart data.
23 23
24 {% endcapture %} 24 {% endcapture %}
25 25
26 {% capture sample_links %} 26 {% capture sample_links %}
27 27
28
29 <p> This tutorial features these examples:</p>
30 * search_form
31 * slambook
32
28 <p> 33 <p>
29 Get the source code for the samples featured in this tutorial:</p> 34 Don't have the source code?
30 35 <a href="https://github.com/dart-lang/dart-tutorials-samples/archive/master.zip" >
31 <ul> 36 Download it.
32 <li> 37 </a>
33 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web /forms/search_form"
34 target="_blank">search_form</a>
35 </li>
36 <li>
37 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web /forms/slambook"
38 target="_blank">slambook</a>
39 </li>
40 </ul>
41 38
42 {% endcapture %} 39 {% endcapture %}
43 40
44 {% capture content %} 41 {% capture content %}
45 42
46 <div class="tute-target-title"> 43 <div class="tute-target-title">
47 <h1>{{page.title}}</h1> 44 <h1>{{page.title}}</h1>
48 <h3>Use forms to get data from users.</h3> 45 <h3>Use forms to get data from users.</h3>
49 </div> 46 </div>
50 47
(...skipping 61 matching lines...) Expand 10 before | Expand all | Expand 10 after
112 the default is to search 109 the default is to search
113 [dartlang.org](http://www.dartlang.org) 110 [dartlang.org](http://www.dartlang.org)
114 for "Cookbook", 111 for "Cookbook",
115 a useful resource for learning about Dart. 112 a useful resource for learning about Dart.
116 113
117 <iframe class="running-app-frame" 114 <iframe class="running-app-frame"
118 style="height:100px;width:500px;" 115 style="height:100px;width:500px;"
119 src="examples/search_form/web/search_form.html"> 116 src="examples/search_form/web/search_form.html">
120 </iframe> 117 </iframe>
121 118
122 The source code for this example is available on github:
123 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/for ms/search_form"
124 target="_blank">search_form</a>.
125
126 Here is the HTML code that creates the form: 119 Here is the HTML code that creates the form:
127 120
128 {% prettify html %} 121 {% prettify html %}
129 <form action="http://www.google.com/search" 122 <form action="http://www.google.com/search"
130 method="GET" 123 method="GET"
131 target="_blank"> 124 target="_blank">
132 ... 125 ...
133 </form> 126 </form>
134 {% endprettify %} 127 {% endprettify %}
135 128
(...skipping 98 matching lines...) Expand 10 before | Expand all | Expand 10 after
234 <hr> 227 <hr>
235 228
236 **Try it!** 229 **Try it!**
237 Enter some data and push the **Submit** button. 230 Enter some data and push the **Submit** button.
238 231
239 <iframe class="running-app-frame" 232 <iframe class="running-app-frame"
240 style="height:500px;width:525px;" 233 style="height:500px;width:525px;"
241 src="examples/slambook/out/web/slambook.html"> 234 src="examples/slambook/out/web/slambook.html">
242 </iframe> 235 </iframe>
243 236
244 The complete source code for both the client and the
245 server is available on github:
246 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/for ms/slambook" target="_blank">slambook</a>
247
248 The request gives you an innocent stare and displays "No server" 237 The request gives you an innocent stare and displays "No server"
249 because you are not running the server on your machine. 238 because you are not running the server on your machine.
250 Let's fix that. 239 Let's fix that.
251 240
252 ###Run the server 241 ###Run the server
253 242
254 Download or copy the source code for the basic server program 243 Get the source code for the basic server program,
255 from the github repository: 244 slambookserver.dart,
256 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/for ms/slambook/bin/slambookserver.dart" 245 from the
257 target="_blank">slambookserver.dart</a> 246 <a href="https://github.com/dart-lang/dart-tutorials-samples/archive/master.zip" >
247 tutorials samples
248 </a>
249 download.
258 250
259 Run the server program from the command line: 251 Run the server program from the command line:
260 252
261 {% prettify %} 253 {% prettify %}
262 % dart slambookserver.dart 254 % dart slambookserver.dart
263 Listening for GET and POST on http://127.0.0.1:4040 255 Listening for GET and POST on http://127.0.0.1:4040
264 {% endprettify %} 256 {% endprettify %}
265 257
266 Now, you can try submitting data again with the slambook app above. 258 Now, you can try submitting data again with the slambook app above.
267 259
(...skipping 582 matching lines...) Expand 10 before | Expand all | Expand 10 after
850 842
851 * Click to select one option. 843 * Click to select one option.
852 * Shift-click to select options in series. 844 * Shift-click to select options in series.
853 * Command-click to make a discontiguous selection. 845 * Command-click to make a discontiguous selection.
854 846
855 <iframe class="running-app-frame" 847 <iframe class="running-app-frame"
856 style="height:400px;width:500px;" 848 style="height:400px;width:500px;"
857 src="http://dart-lang.github.io/dart-tutorials-samples/web/forms/multise lect/web/out/multiselect.html"> 849 src="http://dart-lang.github.io/dart-tutorials-samples/web/forms/multise lect/web/out/multiselect.html">
858 </iframe> 850 </iframe>
859 851
860 The source code for this example is available on github:
861 <a href="https://github.com/dart-lang/dart-tutorials-samples/tree/master/web/for ms/multiselect"
862 target="_blank">multiselect</a>.
863
864 Key-value pairs in a map called `books` contain the data 852 Key-value pairs in a map called `books` contain the data
865 for the &lt;select&gt; element. 853 for the &lt;select&gt; element.
866 The keys are strings and the values are boolean. 854 The keys are strings and the values are boolean.
867 855
868 {% prettify dart %} 856 {% prettify dart %}
869 final Map<String, bool> books = toObservable( 857 final Map<String, bool> books = toObservable(
870 { 'The Cat in the Hat': true, 'War and Peace': false, 858 { 'The Cat in the Hat': true, 'War and Peace': false,
871 'Pride and Prejudice': true, 'On the Road': true, 859 'Pride and Prejudice': true, 'On the Road': true,
872 'The Hunger Games': true, 'The Java Tutorial': false, 860 'The Hunger Games': true, 'The Java Tutorial': false,
873 'The Joy of Cooking': false, 'Goodnight Moon': true } 861 'The Joy of Cooking': false, 'Goodnight Moon': true }
(...skipping 92 matching lines...) Expand 10 before | Expand all | Expand 10 after
966 ###What next? 954 ###What next?
967 955
968 The next tutorial, 956 The next tutorial,
969 [Use IndexedDB](/docs/tutorials/indexeddb), 957 [Use IndexedDB](/docs/tutorials/indexeddb),
970 describes how to save data on the client 958 describes how to save data on the client
971 in the browser's Indexed Database. 959 in the browser's Indexed Database.
972 960
973 {% endcapture %} 961 {% endcapture %}
974 962
975 {% include tutorial.html %} 963 {% include tutorial.html %}
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698