IntroductionToWebPart2

Understanding The Basics of Dynamic Views in Html like forms and input tags and buttons

Html page ➢ index.html

<!-- Comments in html //-->

<!Doctype html>
<html>
<head>
<title>Online tutorials</title>
</head>
<body>
<center><h1>Forms Demo</h1></center>
<!--The HTML <form>...</from> element defines a form that is used to collect user input: //-->
<!--Form elements are different types -> input fields, text fields, checkboxes, radio buttons, submit buttons etc. //-->
<!-- The <input/> element is the most important form element.
can be displayed in several ways, depending on the type attribute. //-->
<!--
<input type="text">               ---- Defines a one-line text input field
<input type="radio">            ---- Defines a radio button (for selecting one of many choices)
<input type="checkbox">     ---- Defines a Checkbox (for selecting many choices)
<input type="password">     ---- Defines a password field
<input type="email">           ---- Defines a email input field newly introduced in html5
<input type="date">             ---- Defines a date input field newly introduced in html5
<input type="number">        ---- Defines a number input field
<input type="file">               ---- Which is used to upload the file
<input type="submit">         ---- Defines a submit button (for submitting the form)
//-->
<!--

➽ Form field contains three attributes name as "action","method" and "enctype" Depending on this attributes the operations to be performed at backend.
Action attribute in this attribute we give file name of server pages for storing data in back end databases.
➨Method attribute contains two types get and post.
➤When to Use GET?
1.The default method when submitting form data is GET.
2.However, when GET is used, the submitted form data will be visible in the page address field:
3.upto 1024 characters.
➤When to Use POST?
1.Always use POST if the form data contains sensitive or personal information. The POST method does not display the submitted form data in the page address field.
2.POST has no size limitations, and can be used to send large amounts of data. //-->
 <!-- Input field contains mainly two important attributes called name and id we have many attributes like size,maxlength but mainly we use above two for transfering data to server pages or for form validation in javascript which we will discuss upcoming videos. //-->

 <!-- Know lets design the form //-->
 <center><table border="1">
 <form action="#" method="post">
 <tr>
 <th>Enter yourName:</th><td><input type="text" name="name"/></td>
 </tr>
 <tr>
 <th>Enter Father name:</th><td><input type="text" name="fname"/><br></td>
 </tr>
 <tr><th>gender:</th><td><input type="radio" name="gender" value="m"/>male
  <input type="radio" name="gender" value="f"/>female</td>
 </tr>
 <tr><th>Have vechicle:</th><td><input type="checkbox" name="Bike"/>  bike<input type="checkbox" name="car"/>Car</td>
 </tr>
 <tr><th>Email:</th><td><input type="email" name="email"/></td>
 </tr>
 <tr><th>Date of registeration:</th><td><input type="date" name="date"/> </td>
 </tr>
 <tr><th>Create usernmae:</th><td><input type="text" name="uname"/></td>
 </tr>
 <tr><th>create password:</th><td><input type="password" name="password"/></td>
 </tr>
 <tr><th>Upload photo here:</th><td><input type="file" name="photo"/></td>
 </tr>
 <tr><th colspan="2"><textarea rows="4" cols="50" placeholder="Enter Some Message"></textarea>
 </th></tr>
 <tr><th colspan="2"><input type="submit" value="submit"></th></tr>
 </form>
 </table></center>
</body>
</html>

If you want to see how its runs in actual browser.


Comments

Post a Comment

Popular posts from this blog

Online Web Tutorials

Image
Welcome to Online web development course ➨Hai friends, I gonna create this blog to post the examples which I discussed in my youtube channel regarding web development courses and also some interesting and important latest updates regarding technical trends. ➠I cheer up with you some interesting and inspirational quotes. This is my actual website which I designed this web site using some of the technologies like Html, CSS, jQuery, Bootstrap etc. About Me My name is Lava Kumar studying B.tech 4th year in Anil Neerukonda Institute of technologies I know some of the programming languages ➟c, c++, java, python, Android app development etc I know some of the web technologies like ➟HTML, CSS, Javascript, PHP, JSP, Jquery, Bootstrap, Materialized CSS, Nodejs etc. I want to deliver all my lectures and to share my knowledge to all of you apart from that to cheer up I  will post some Interesting facts, quotes and funny jokes😊😊. Tutorials on HTML and CS...
Read more

KotlinByLavaKumar

Image
Kotlin: 1)👉 It’s a new programming language targeting the Java  platform 2) 👉  It is developed by JetBrains for modern multiplatform applications. 3) 👉   Kotlin is concise, safe, pragmatic, and focused on interoperability with Java code 4) 👉  It can be used almost everywhere Java is used today - for server-side development,  Android apps, and much more. 5) 👉  Kotlin works great with all existing Java libraries and  frameworks and runs with the same level of performance as Java. 6) 👉  After a few years, Google wants to introduce a new Operating System for that Kotlin is the Base Language. History about Kotlin:😎 1) From many years, There is a clash between Oracle and Google regarding java. Java is native for Oracle for using Java as programming language Google pay's lots of money to it. Finally, Google fed up with that and introduced a new programming language called Kotlin. 2) And This Kotlin language has many ...
Read more