Showing posts with label html form input type. Show all posts
Showing posts with label html form input type. Show all posts

Saturday, October 29, 2022

html form tag

                    HTML Tag 

Form Tag


1]File Upload Tag


<input type="file">

A control that lets the user selects a file. Use the accept attribute to define the type of files that the control can select.


File Tag program 

<!DOCTYPE html>

 <html>

<body>

<h1>File upload</h1>

 <p>Show a file-select field which allows a file to be chosen for upload:</p>

 <form action="/action.php">

 Select a file: <input type="file" name="myFile"><br><br>

<input type="submit">

</form>

</body>

 </html>

file Tag Output


File program output


2]Submit  Button

<input type= "submit">

A button that submit the form.<input type ="submit"> defines a button for submitting form data to form-handler. The form-handler is typically a server page with a script for processing input data. the form -handler is specified in the forms action attribute.


Submit Tag program 

 <!DOCTYPE html>

 <html>

 <body>

<h2>Submit Button</h2>

<p>The <strong>input type="submit"</strong> defines a button for submitting form data to a form-handler:</p>

 <form action="/action.asp">

 First name:<br>

 <input type="text" name="firstname" value="Sanjay"><br>

Last name: <br>

 <input type="text" name="lastname" value="jadhv"><br><br>

<input type="submit" value="Submit">

</form>

<p>If you click "Submit", the form-data will be sent to a page called "/action.asp"</p>

</body>

</html>


submit Tag output

Submit program output


3] Reset Tag 

<input type="reset">

A button that resets the contents of  the form to default values.


Reset tag program 

<!DOCTYPE html>

<html>

<body>

<h2>Reset Button</h2>

<p>Reset button that will reset all form values to their default values </p>

 <form action="/action.asp">

 First Name :<input type="text" name="firstname" value="Surya"><br>

 Last name :<input type="text" name="lastname" value="Rad><br><br>

 <input type="submit" value="Submit">

<input type="reset">

</form>

<p>If you change the input values and then click the "Reset" button,<br> the form-data will be reset to the default values.</p>

</html>


Reset tag output


Reset tag output

4] button Tag

<input type="button">

Buttons are created as the final component of any form. A button lets the user trigger son events like submission of data, upload/download or any kind of alert/message.


Button Tag program 

<!DOCTYPE html>

<html>

<body>

<h2>Input Button</h2>

<input type="button" onclick="alert("Hello World!')" value="Click Me!">

 </body>

</html>

Button Tag output 

Button Tag output


5] Checkbox Tag


<input type="checkbox">

A check box allowing multiple values to be selected/de selected.


Checkbox Tag program 

<html>

 <body>

 <h2>Checkboxes</h2>

<p> The<strong>input type="checkbox"</strong>

defines a checkbox</p>

<form action="/action_page.php">

 <input type="checkbox" name="vehicle1" value="sports car">

<P>I have sports car</p><br>

<input type="checkbox" name="vehicle2" value="Luxury Car"> 

<P>I have a Luxury car</p><br><br>

<input type="submit">

</form>

</body>

</html>

Checkbox Tag output 


Checkbox Tag output


Visit This Link

To Your extra information 



HTML meta attribute