Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
30 views

HTML Forms: John Ryan B. Lorca Instructor I

An HTML form allows users to enter and submit data to a server. It contains form elements like text boxes, checkboxes, radio buttons, and menus. The document provides examples of the code for each element. It also gives an example problem of creating a form that accepts two integers and calculates their sum using JavaScript functions. The solution shows the HTML and JavaScript code to build the form and process the submission to display the result.

Uploaded by

Eric Nilo
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
30 views

HTML Forms: John Ryan B. Lorca Instructor I

An HTML form allows users to enter and submit data to a server. It contains form elements like text boxes, checkboxes, radio buttons, and menus. The document provides examples of the code for each element. It also gives an example problem of creating a form that accepts two integers and calculates their sum using JavaScript functions. The solution shows the HTML and JavaScript code to build the form and process the submission to display the result.

Uploaded by

Eric Nilo
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 7

HTML Forms

John Ryan B. Lorca Instructor I

What is an HTML Form?


A tag enclosing other necessary form elements (e.g. Text box, menu) important for database processing or client-side computing

HTML Form Elements


Text box a text field
<input type=text name=txtVAR id=txtVAR value=default_value />

Check box allows multiple options


<input type=check name=chkVAR id=chkVAR checked=checked />

HTML Form Elements


Radio button allows only one option
<input type=radio name=optVAR id=optVAR checked=checked />

Menu allows selecting one or many options through a drop down list or list box
<select name=mnuVAR id=mnuVAR> <option value=value_1>menu_item_1</option> <option value=value_2>menu_item_2</option> <option value=value_n>menu_item_n</option> </select>
4

HTML Form and JavaScript: Sample Problem


Develop a web application that accepts two integer and computes for the sum of the integers.

HTML Form and JavaScript: Solution


<html> <head><title>Addition</title> <script type=text/javascript> function getSum (form) { var x = document.frmAPP.txtNUM1.value; var y = document.frmAPP.txtNUM2.value; var sum = document.frmAPP.txtRESULT.value; if (x == || y == ) { alert(Please provide two integers!); } else { sum = x + y; } } </script> </head>
6

HTML Form and JavaScript: Solution (ctd)


<body> <form name=frmAPP> Integer 1: <input type=text name=txtNUM1 /><br /> Integer 2: <input type=text name=txtNUM2 /><br /> Result: <input type=text name=txtRESULT /><br /> <input type=button value=ADD onclick=getSum(document.frmAPP) /> </form> </body> </html>

You might also like