543:
1121:
applications (CGIs). In fact, Perl is such a common way to write CGIs that the two are often confused. CGIs may be written in other languages than Perl (compatibility with multiple languages is a design goal of the CGI protocol) and there are other ways to make Perl scripts interoperate with a
359:
input type can be represented as an input text simply checking the value entered is a correct hexadecimal representation of a color, according to the specification, or a color picker widget (the latter being the solution used in most browsers which support this attribute).
346:
when the web page containing the form is loaded, and placeholder text that is displayed within the field but is not user input (such as the 'Search' text displayed in many search input fields before a search term is entered). These tasks used to be handled with
1041:
function to sanitize the user's input before inserting it onto the page. Simply printing (echoing) user input to the browser without checking it first is something that should be avoided in secure forms processors: if a user entered the JavaScript code
325:
attribute. This allows labels to stay with their elements when a window is resized and to allow more desktop-like functionality (e.g. clicking a radio button or checkbox's label will activate the associated input element).
1286:
companies provide templates to their clients as an add-on service. Other form hosting services offer free contact forms that a user can install on their own website by pasting the service's code into the site's HTML.
329:
HTML 5 introduces a number of input tags that can be represented by other interface elements. Some are based upon text input fields and are intended to input and validate specific common data. These include
299:. In both cases, a server-side process is responsible for processing the information, while JavaScript handles the user-interaction. Implementations of these interface elements are available through
531:
ways. In addition, processing forms on a server often results in increased security if server-side execution is designed not to trust the data supplied by the client and includes such techniques as
1262:, however, and many of the most popular form-to-email scripts in use are vulnerable to hijacking for the purpose of sending spam emails. One of the most popular scripts of this type was
1447:
as the form action, was proposed in RFC 1867 section 5.6, during the HTML 3.2 era. Various web browsers implemented it by invoking a separate email program, using their own rudimentary
1258:
Among the simplest and most commonly needed types of server-side script is that which simply emails the contents of a submitted form. This kind of script is frequently exploited by
1282:. Usually, these companies give some kind of visual editor, reporting tools and infrastructure to create and host the forms, that can be embedded into webpages.
503:
Server-side code can do a vast assortment of tasks to create dynamic web sites that, for technical or security reasons, client-side code cannot — from
523:. A significant advantage to server-side over client-side execution is the concentration of functionality onto the server rather than relying on different
91:
368:
When data that has been entered into HTML forms is submitted, the names and values in the form elements are encoded and sent to the server in an
1270:. Today, this script is no longer widely used in new development due to lack of updates, security concerns, and difficulty of configuration.
314:
tag, which is intended to represent a caption in a user interface, and can be associated with a specific form control by specifying the
1586:
539:—server side processing for all users occurs on the server, while client side processing occurs on individual client computers.
1149:. However, many web hosts today effectively only support PHP, and developers of web applications often seek compatibility with them.
389:
1459:. Although sometimes unreliable, it was briefly popular as a simple way to transmit form data without involving a web server or
1564:
443:
handling functionality than programming languages such as C, and also have automatic memory management which helps to prevent
588:
483:
of the form data and/or to prepare the form data to send to a server-side program. This usage is being replaced, however, by
435:
Although any programming language can be used on the server to process a form's data, the most commonly used languages are
1448:
564:
606:
is one very common language used for server-side "programming" and is one of the few languages created specifically for
584:
568:
373:
542:
178:, it is used for security purposes, in which the characters typed in are invisible or replaced by symbols such as *
291:
with each cell containing a text input element. A tree view could also be mimicked through nested tables or, more
1440:
342:
for numeric values. There are additional attributes to specify required fields, fields that should have keyboard
1460:
1444:
1118:
273:
134:
1267:
207:
that, when activated, tells the browser to restore the values of the current form, to their initial values.
1559:
633:
attribute used in the form. Here is a basic form handler PHP script that will display the contents of the
110:
1569:
1279:
469:
461:
617:
attribute of the form tag. The target PHP file then accesses the data passed by the form through PHP's
479:
While client-side languages used in conjunction with forms are limited, they often can serve to do pre-
556:
440:
421:
1520:
1099:
436:
409:
1591:
1135:
425:
300:
214:
47:
1080:
page, just as if it had been coded by the developer; malicious code could be executed this way.
1152:
A modern Perl 5 CGI using the CGI module with a form similar to the one above might look like:
532:
456:
343:
1502:
1131:
580:
576:
393:
355:
input type displays a calendar from which the user can select a date or date range. And the
1146:
1114:
607:
480:
51:
1362:
864:// requesting the value of the external variable "first_name" and filtering it.
1452:
504:
444:
318:
256:
238:
1596:
1580:
528:
516:
79:
63:
1414:
432:. The most popular languages include both client-side and/or server-side languages.
217:
that tells the browser to take action on the form (typically to send it to a server)
1487:
1456:
473:
296:
288:
204:
185:
114:
1549:
1283:
536:
524:
476:
that allows dynamic creation and modification of a web page within the browser.
377:
351:, but had become so common that support for them was added to the standard. The
194:
75:
67:
1123:
465:
348:
95:
90:
1263:
613:
To use PHP with an HTML form, the URL of the PHP script is specified in the
385:
281:
277:
78:
data to order a product, or can be used to retrieve search results from a
17:
1313:
1296:
1139:
512:
429:
145:
71:
59:
55:
43:
1388:
1343:
276:(GUI) elements, but not all. For example, there are no equivalents to a
1308:
1259:
1127:
1089:
was introduced in PHP 5.2. Users of earlier PHP versions could use the
592:
397:
1318:
520:
304:
546:
Registration form of PHP-based e-commerce web-shop software ZenCart
412:, is also available and is common for POST-based file submissions.
541:
508:
484:
381:
252:
a pair of radio buttons asking you to choose between gender values
559:
commonly used to design interactive forms in web development are
1323:
1110:
572:
369:
292:
103:
287:
A grid view, however, can be mimicked by using a standard HTML
113:
the data entered into the form should be submitted to, and the
1553:
603:
560:
420:
Forms are usually combined with programs written in various
245:
The sample image on the right shows most of these elements:
1102:
to sanitize the user input before doing anything with it.
268:
a submit button to send current form values to the server
231:
allows for multiple rows of data to be shown and entered
1473:
392:, is based on a very early version of the general URI
262:
a pair of check boxes to click on if they apply to you
583:
and some of the compiled languages commonly used are
241:
that displays a list of items a user can select from
1090:
1081:
1076:field, the browser would execute the script on the
1043:
1033:
624:
618:
408:". Another possible encoding, Internet media type
158:that requires a partially validated email address
58:forms because web users fill out the forms using
1145:Perl CGIs were once a very common way to write
527:to implement various functions in consistent,
396:rules, with a number of modifications such as
259:giving you a list of eye colors to choose from
46:allows a user to enter data that is sent to a
272:These basic elements provide the most common
265:a text area to describe your athletic ability
8:
148:that allows input of a single line of text.
70:. For example, forms can be used to enter
1565:Wikibooks: HyperText Markup Language/Forms
535:. One disadvantage to server side code is
1503:"Intro to Online Forms and Form Builders"
1295:HTML forms were first implemented by the
1117:. Perl scripts are traditionally used as
629:variables, depending on the value of the
400:normalization and replacing spaces with "
109:element. This HTML element specifies the
94:Sample form. The form is enclosed in an
89:
1415:"input type=color – color-well control"
1335:
511:, to retrieving and storing data in a
384:transport was also used. The default
7:
1439:User-agent support for email based
1363:"Better Web Forms with HTML5 Forms"
1113:is another language often used for
50:for processing. Forms can resemble
1443:form submission, using a 'mailto'
1032:The sample code above uses PHP's
321:of the control in the label tag's
25:
1556:'s spec page for forms in HTML 4.
1361:Satrom, Brandon (November 2011).
390:application/x-www-form-urlencoded
133:Forms can be made up of standard
1278:Some companies offer forms as a
386:MIME type (internet media type)
249:a text box asking for your name
439:, which tend to have stronger
416:Use with programming languages
1:
1474:"PHP: Hypertext Preprocessor"
1451:capabilities, or by becoming
472:(DOM) leads to the method of
728:"form_handler.php"
197:control for uploading a file
1613:
1239:"Hello, $ name!"
468:. Using JavaScript on the
464:language for web sites is
334:to enter email addresses,
102:Forms are enclosed in the
27:Input fields on a Web page
1587:User interface techniques
1560:HTML5 forms specification
1106:Perl programming language
637:input field on the page:
1570:Try out HTML properties.
1161:
1126:than using CGI (such as
1119:Common Gateway Interface
997:/* printing the value */
855:
646:
274:graphical user interface
135:graphical user interface
117:of submitting the data,
1550:Forms in HTML documents
1455:by implementing entire
338:for telephone numbers,
1203:"first_name"
891:FILTER_SANITIZE_STRING
885:"first_name"
762:"first_name"
547:
372:request message using
310:HTML 4 introduced the
295:appropriately, nested
227:input field except a
168:that requires a number
111:communication endpoint
99:
1389:"Forms – HTML5"
1344:"HTML/Elements/label"
1268:Matt's Script Archive
1254:Form-to-email scripts
858:<!DOCTYPE html>
649:<!DOCTYPE html>
557:interpreted languages
551:Interpreted languages
545:
499:Server-side execution
470:Document Object Model
462:client-side scripting
93:
422:programming language
301:JavaScript libraries
1527:. Web Design Museum
1525:webdesignmuseum.org
1164:#!/usr/bin/env perl
1100:regular expressions
437:scripting languages
410:multipart/form-data
380:. Historically, an
1488:"Encyclopedia Web"
798:"submit"
548:
428:to create dynamic
100:
98:for visual layout.
533:HTML sanitization
223:— much like the
16:(Redirected from
1604:
1537:
1536:
1534:
1532:
1517:
1511:
1510:
1501:Garofalo, Josh.
1498:
1492:
1491:
1484:
1478:
1477:
1470:
1464:
1437:
1431:
1430:
1428:
1426:
1411:
1405:
1404:
1402:
1400:
1385:
1379:
1378:
1376:
1374:
1358:
1352:
1351:
1340:
1249:
1246:
1243:
1240:
1237:
1234:
1231:
1228:
1225:
1222:
1219:
1216:
1213:
1210:
1207:
1204:
1201:
1198:
1195:
1192:
1189:
1186:
1183:
1180:
1177:
1174:
1171:
1168:
1165:
1158:
1147:web applications
1097:
1096:
1093:
1092:htmlspecialchars
1088:
1087:
1084:
1079:
1078:form_handler.php
1075:
1071:
1070:
1067:
1064:
1061:
1058:
1055:
1052:
1049:
1046:
1040:
1039:
1036:
1028:
1025:
1022:
1019:
1016:
1013:
1010:
1007:
1004:
1001:
998:
995:
992:
989:
986:
983:
980:
977:
974:
971:
968:
965:
962:
959:
956:
953:
950:
947:
944:
941:
938:
934:
931:
928:
925:
922:
919:
916:
913:
910:
907:
904:
901:
898:
895:
892:
889:
886:
883:
880:
877:
874:
871:
868:
865:
862:
859:
852:
851:form_handler.php
845:
842:
839:
836:
833:
830:
827:
824:
821:
818:
815:
812:
809:
806:
802:
799:
796:
793:
790:
787:
784:
781:
778:
775:
772:
769:
766:
763:
760:
757:
754:
751:
747:
744:
741:
738:
735:
732:
729:
726:
723:
720:
717:
714:
711:
708:
705:
702:
699:
696:
693:
690:
686:
683:
680:
677:
674:
671:
668:
665:
662:
659:
656:
653:
650:
643:
636:
632:
628:
627:
622:
621:
616:
581:Adobe ColdFusion
494:
491:field types and
490:
407:
403:
394:percent-encoding
358:
354:
341:
337:
333:
324:
317:
313:
236:
230:
229:<textarea>
226:
222:
221:<textarea>
212:
202:
192:
183:
177:
173:
172:<password>
167:
163:
157:
153:
143:
124:
120:
108:
21:
1612:
1611:
1607:
1606:
1605:
1603:
1602:
1601:
1577:
1576:
1546:
1541:
1540:
1530:
1528:
1519:
1518:
1514:
1500:
1499:
1495:
1486:
1485:
1481:
1472:
1471:
1467:
1453:Internet suites
1438:
1434:
1424:
1422:
1413:
1412:
1408:
1398:
1396:
1387:
1386:
1382:
1372:
1370:
1360:
1359:
1355:
1342:
1341:
1337:
1332:
1305:
1293:
1276:
1256:
1251:
1250:
1247:
1244:
1241:
1238:
1235:
1232:
1229:
1226:
1223:
1220:
1217:
1214:
1211:
1208:
1205:
1202:
1199:
1196:
1193:
1190:
1187:
1184:
1181:
1178:
1175:
1172:
1169:
1166:
1163:
1157:form_handler.pl
1156:
1115:web development
1108:
1094:
1091:
1085:
1082:
1077:
1073:
1068:
1065:
1062:
1059:
1056:
1053:
1050:
1047:
1044:
1037:
1034:
1030:
1029:
1026:
1023:
1020:
1017:
1014:
1011:
1008:
1005:
1002:
999:
996:
993:
990:
987:
984:
981:
978:
975:
972:
969:
966:
963:
960:
957:
954:
951:
948:
945:
942:
939:
936:
932:
929:
926:
923:
920:
917:
914:
911:
908:
905:
902:
899:
896:
893:
890:
887:
884:
881:
878:
875:
872:
869:
866:
863:
860:
857:
850:
847:
846:
843:
840:
837:
834:
831:
828:
825:
822:
819:
816:
813:
810:
807:
804:
800:
797:
794:
791:
788:
785:
782:
779:
776:
773:
770:
767:
764:
761:
758:
755:
752:
749:
745:
742:
739:
736:
733:
730:
727:
724:
721:
718:
715:
712:
709:
706:
703:
700:
697:
694:
691:
688:
684:
681:
678:
675:
672:
669:
666:
663:
660:
657:
654:
651:
648:
641:
634:
630:
625:
619:
614:
608:web programming
601:
553:
501:
492:
488:
453:
418:
405:
401:
366:
356:
352:
339:
335:
331:
322:
315:
311:
234:
228:
224:
220:
210:
200:
190:
181:
175:
171:
165:
161:
155:
151:
141:
131:
122:
118:
106:
88:
28:
23:
22:
15:
12:
11:
5:
1610:
1608:
1600:
1599:
1594:
1589:
1579:
1578:
1573:
1572:
1567:
1562:
1557:
1545:
1544:External links
1542:
1539:
1538:
1512:
1493:
1479:
1465:
1432:
1406:
1380:
1353:
1350:. 19 May 2023.
1334:
1333:
1331:
1328:
1327:
1326:
1321:
1316:
1311:
1304:
1301:
1292:
1289:
1280:hosted service
1275:
1272:
1255:
1252:
1162:
1107:
1104:
912:"en"
856:
664:"en"
647:
600:
597:
552:
549:
517:spell checking
505:authenticating
500:
497:
452:
449:
445:buffer overrun
417:
414:
404:" instead of "
365:
362:
340:<number>
270:
269:
266:
263:
260:
253:
250:
243:
242:
239:drop-down list
235:<select>
232:
218:
211:<submit>
208:
198:
188:
179:
174:— similar to
169:
162:<number>
159:
149:
130:
127:
87:
84:
26:
24:
14:
13:
10:
9:
6:
4:
3:
2:
1609:
1598:
1595:
1593:
1590:
1588:
1585:
1584:
1582:
1575:
1571:
1568:
1566:
1563:
1561:
1558:
1555:
1551:
1548:
1547:
1543:
1526:
1522:
1516:
1513:
1508:
1504:
1497:
1494:
1489:
1483:
1480:
1475:
1469:
1466:
1462:
1458:
1457:Email clients
1454:
1450:
1446:
1442:
1436:
1433:
1420:
1416:
1410:
1407:
1394:
1390:
1384:
1381:
1368:
1367:MSDN Magazine
1364:
1357:
1354:
1349:
1345:
1339:
1336:
1329:
1325:
1322:
1320:
1317:
1315:
1312:
1310:
1307:
1306:
1302:
1300:
1298:
1290:
1288:
1285:
1281:
1274:Form builders
1273:
1271:
1269:
1265:
1264:"FormMail.pl"
1261:
1253:
1182:qw(:standard)
1160:
1159:
1153:
1150:
1148:
1143:
1141:
1137:
1133:
1129:
1125:
1120:
1116:
1112:
1105:
1103:
1101:
1098:function, or
979:"Hello,
854:
853:
645:
644:
638:
611:
609:
605:
598:
596:
594:
590:
586:
582:
578:
574:
570:
566:
562:
558:
550:
544:
540:
538:
534:
530:
526:
522:
519:, to sending
518:
514:
510:
506:
498:
496:
486:
482:
477:
475:
471:
467:
463:
460:
459:
450:
448:
446:
442:
438:
433:
431:
427:
423:
415:
413:
411:
399:
395:
391:
387:
383:
379:
375:
371:
363:
361:
350:
345:
332:<email>
327:
320:
312:<label>
308:
306:
302:
298:
294:
290:
285:
283:
279:
275:
267:
264:
261:
258:
254:
251:
248:
247:
246:
240:
233:
219:
216:
209:
206:
201:<reset>
199:
196:
189:
187:
182:<radio>
180:
170:
164:- a type of
160:
154:- a type of
152:<email>
150:
147:
140:
139:
138:
136:
128:
126:
116:
112:
105:
97:
92:
85:
83:
81:
80:search engine
77:
73:
69:
65:
64:radio buttons
61:
57:
53:
49:
45:
41:
37:
33:
19:
1574:
1529:. Retrieved
1524:
1515:
1507:Blitzen Blog
1506:
1496:
1482:
1468:
1435:
1423:. Retrieved
1418:
1409:
1397:. Retrieved
1392:
1383:
1371:. Retrieved
1366:
1356:
1347:
1338:
1294:
1277:
1257:
1155:
1154:
1151:
1144:
1109:
1083:filter_input
1035:filter_input
1031:
873:filter_input
849:
848:
640:
639:
612:
602:
555:Some of the
554:
529:standardized
525:web browsers
502:
478:
474:Dynamic HTML
457:
454:
434:
419:
367:
353:<date>
328:
309:
293:semantically
286:
271:
244:
225:<text>
205:reset button
191:<file>
186:radio button
176:<text>
166:<text>
156:<text>
142:<text>
132:
107:<form>
101:
39:
35:
31:
29:
1531:17 February
1399:20 February
1373:20 February
1369:. Microsoft
1348:w3.org wiki
1284:Web hosting
867:$ firstName
537:scalability
495:attribute.
451:Client-side
336:<tel>
195:file select
144:— a simple
86:Description
76:credit card
68:text fields
1581:Categories
1521:"ViolaWWW"
1425:31 October
1330:References
1124:web server
765:/></
635:first_name
481:validation
466:JavaScript
426:developers
364:Submission
349:JavaScript
257:select box
137:elements:
96:HTML table
60:checkboxes
18:Form (web)
1592:HTML tags
1299:browser.
1074:firstname
1072:into the
985:firstName
879:INPUT_GET
811:></
771:></
642:form.html
447:attacks.
430:web sites
424:to allow
319:attribute
282:grid view
278:tree view
40:HTML form
1463:scripts.
1314:Postback
1303:See also
1266:made by
1260:spammers
1140:mod_perl
973:<?php
861:<?php
786:><
740:><
513:database
493:required
458:de facto
303:such as
146:text box
129:Elements
72:shipping
56:database
44:web page
36:web form
1309:CAPTCHA
1291:History
1128:FastCGI
991:!"
620:$ _POST
593:ASP.NET
487:'s new
398:newline
32:webform
1552:, the
1419:w3.org
1393:w3.org
1319:XForms
1212:header
1191:$ name
1170:strict
1136:Apache
1066:script
1063:)</
1048:script
935:Output
808:button
803:Submit
789:button
748:Name:
722:action
631:method
626:$ _GET
615:action
565:Python
521:e-mail
441:string
305:jQuery
215:button
115:method
48:server
1421:. W3C
1395:. W3C
1297:Viola
1218:print
1209:print
1197:param
1132:Plack
1054:alert
1021:</
1012:</
1003:</
1000:?>
946:</
940:title
937:</
930:title
897:?>
838:</
829:</
820:</
805:</
768:label
753:input
743:label
698:</
692:title
689:</
682:title
591:with
515:, to
509:login
489:input
485:HTML5
382:email
357:color
344:focus
297:lists
289:table
66:, or
52:paper
42:on a
1597:HTML
1533:2022
1449:SMTP
1441:HTML
1427:2014
1401:2014
1375:2014
1324:HTML
1227:body
1221:html
1111:Perl
1069:>
1051:>
1045:<
1027:>
1024:html
1018:>
1015:body
1009:>
976:echo
970:>
964:<
961:>
958:body
955:<
952:>
949:head
943:>
933:>
927:<
924:>
921:head
918:<
915:>
906:lang
903:html
900:<
844:>
841:html
835:>
832:body
826:>
823:form
817:>
801:>
792:type
780:<
777:>
756:name
750:<
746:>
734:<
731:>
719:form
716:<
713:>
710:body
707:<
704:>
701:head
695:>
687:Form
685:>
679:<
676:>
673:head
670:<
667:>
658:lang
655:html
652:<
587:and
585:Java
573:Perl
569:Ruby
455:The
378:POST
370:HTTP
237:— a
213:— a
203:— a
193:— a
184:— a
123:POST
104:HTML
1554:W3C
1461:CGI
1445:URL
1179:CGI
1176:use
1167:use
1142:).
1138:'s
1134:or
982:$ {
623:or
604:PHP
599:PHP
577:JSP
561:PHP
406:%20
376:or
374:GET
323:for
280:or
121:or
119:GET
74:or
54:or
38:or
1583::
1523:.
1505:.
1417:.
1391:.
1365:.
1346:.
1248:);
1245:),
1242:),
1206:);
1188:my
1130:,
1095:()
1086:()
1038:()
894:);
610:.
595:.
589:C#
579:,
575:,
571:,
567:,
563:,
507:a
388:,
316:id
307:.
284:.
255:a
125:.
82:.
62:,
34:,
30:A
1535:.
1509:.
1490:.
1476:.
1429:.
1403:.
1377:.
1236:(
1233:p
1230:(
1224:(
1215:;
1200:(
1194:=
1185:;
1173:;
1060:1
1057:(
1006:p
994:;
988:}
967:p
909:=
888:,
882:,
876:(
870:=
814:p
795:=
783:p
774:p
759:=
737:p
725:=
661:=
402:+
20:)
Text is available under the Creative Commons Attribution-ShareAlike License. Additional terms may apply.