XHTML FormsWhy forms?Slide 3Forms in XHTMLSlide 5Slide 6The Form ElementForm methodsThe submit buttonThe reset buttonTypes of input elementsSlide 12Slide 13Slide 14Slide 15Slide 16Slide 17Form exampleXHTML FormsI450 Technology SeminarCopyright 2003, Matt HottellWhy forms?Why forms?Forms are the most basic way of getting user input into your web page.Forms in XHTMLIn the XHTML 2.0 specification coming out late this year a new XML-based system called xForms will be used.Forms in XHTMLIn the XHTML 2.0 specification coming out late this year a new XML-based system called xForms will be used.xForms is designed to be able to send user input using XML, allowing for better communication with e-commerce web applicationsXHTML FormsFor the current XHTML 1.0 standard, HTML form elements are used to get user input.The Form ElementAll form tags must be contained inside of a form element<form method=“post” action=“mailto:[email protected]”></form>Form methodsGet Sends information inside of the urlPostSends information inside of a bit stream The information sent is not viewable within the URLThe submit buttonThe submit button sends the form data to the specified place for processing.<input type=“submit” value=“send” />The reset buttonThe reset button returns the form to it’s original state when first loaded<input type=“reset” value=“clear” />Types of input elementsBasic text box<form method=“get” action=“go.asp”><p><b>Name: </b><input type=“text” name=“name” /></p></form>Types of input elementsPassword field<form method=“get” action=“go.asp”><p><b>Password: </b><input type=“password” name=“pass” /></p></form>Types of input elementsRadio boxes<form method=“get” action=“go.asp”><p><b>Sex: </b><input type=“radio” name=“sex” value=“male” />Male<br /><input type=“radio” name=“sex” value=“female” />Female</p></form>Types of input elementsText area:<form method=“get” action=“go.asp”><p><b>Describe yourself:</b><textarea name=“descrip” rows=“5” cols=“50”>Enter text here</textarea></p></form>Types of input elementsDrop down menus<form method=“get” action=“go.asp”><p><b>Sex: </b><select name=“sex” ><option selected=“selected” value=“f”>Female</option><option value=“m”>Male</option></select></p></form>Types of input elementsCheck box:<form method=“get” action=“go.asp”><p><b>Are you an IU Student?</b><input type=“checkbox” name=“student”value=“yes” /></p></form>Types of input elementsFile upload:<form method=“get” action=“go.asp”><p><b>File to upload:</b><input type=“file” name=“filefield” /></p></form>Form