form.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <title>Example page for HTML form handling</title>
  7. </head>
  8. <body>
  9. <!-- HTML forms can use GET or POST, and the encoding can be application/x-www-form-urlencoded or multipart/form-data.
  10. If no method is specified (like <form method="method">), GET should be the default method.
  11. If no encoding is specified, application/x-www-form-urlencoded should be the default.
  12. Submit buttons may overwrite action, method and enctype by using formaction, formmethod and formenctype.
  13. References:
  14. http://www.w3.org/TR/html401/interact/forms.html
  15. http://www.w3schools.com/html/html_forms.asp,
  16. http://www.w3schools.com/html/html_form_attributes.asp
  17. http://www.w3.org/TR/html401/interact/forms.html#adef-enctype
  18. -->
  19. <form action="/handle_form.lua">
  20. See <a href="http://www.w3schools.com/html/html_form_input_types.asp">HTML form tutorial</a>.<br />
  21. <fieldset>
  22. <legend>Text inputs:</legend>
  23. A text: <input type="text" name="textin"><br />
  24. A password: <input type="password" name="passwordin"><br />
  25. </fieldset>
  26. <fieldset>
  27. <legend>Radio set 1:</legend>
  28. <input type="radio" name="radio1" value="val1" checked>val1<br />
  29. <input type="radio" name="radio1" value="val2">val2<br />
  30. <input type="radio" name="radio1" value="val3">val3<br />
  31. </fieldset>
  32. <fieldset>
  33. <legend>Radio set 2:</legend>
  34. <input type="radio" name="radio2" value="val1" checked>val1<br />
  35. <input type="radio" name="radio2" value="val2">val2<br />
  36. <input type="radio" name="radio2" value="val3">val3<br />
  37. </fieldset>
  38. <fieldset>
  39. <legend>Checkboxes:</legend>
  40. <input type="checkbox" name="check1" value="val1" checked>val1<br />
  41. <input type="checkbox" name="check2" value="val2">val2<br />
  42. <input type="checkbox" name="check3" value="val3">val3<br />
  43. </fieldset>
  44. <fieldset>
  45. <legend>HTML5 inputs:</legend>
  46. A number: <input type="number" name="numberin" min="1" max="5"><br />
  47. A date: <input type="date" name="datein"><br />
  48. A color: <input type="color" name="colorin"><br />
  49. A range: <input type="range" name="rangein" min="1" max="5"><br />
  50. A month: <input type="month" name="monthin"><br />
  51. A week: <input type="week" name="weekin"><br />
  52. A time: <input type="time" name="timein"><br />
  53. A datetime: <input type="datetime" name="datetimen"><br />
  54. A datetime-local: <input type="datetime-local" name="datetimelocalin"><br />
  55. An email: <input type="email" name="emailin"><br />
  56. A search: <input type="search" name="searchin"><br />
  57. A tel: <input type="tel" name="telin"><br />
  58. An url: <input type="url" name="urlin"><br />
  59. </fieldset>
  60. <fieldset>
  61. <legend>Files:</legend>
  62. A file: <input type="file" name="filein"><br />
  63. Multiple files: <input type="file" name="filesin" multiple><br>
  64. </fieldset>
  65. <fieldset>
  66. <legend>Dropdown:</legend>
  67. <select name="selectin">
  68. <option value="opt1">opt1</option>
  69. <option value="opt2">opt2</option>
  70. <option value="opt3">opt3</option>
  71. </select>
  72. </fieldset>
  73. <fieldset>
  74. <legend>Text area:</legend>
  75. <textarea name="message" rows="10" cols="30">Text area default text.</textarea>
  76. </fieldset>
  77. <input type="submit" value="Submit (form default)">
  78. <input type="submit" value="Submit (GET)" formmethod="GET">
  79. <input type="submit" value="Submit (POST)" formmethod="POST">
  80. <input type="submit" value="Submit (POST, url-encoded)" formmethod="POST" formenctype="application/x-www-form-urlencoded">
  81. <input type="submit" value="Submit (POST, form-data)" formmethod="POST" formenctype="multipart/form-data">
  82. </form>
  83. </body>
  84. </html>