Action de formulaire HTML
In HTML, we have using a form tag to navigate the web pages. The tag which consists of action, methods and values attribute in the HTML. The Method attributes which specified how to send the data from one page to another page after validation. Generally, we have sent the form data through URL Methods like get and post. Form Tag in HTML is used for web pages that are the user to enter data it will move to server validation, it can resemble the pages because the server validates the user request. Even though all the html tags like checkboxes, radio buttons, text fields, etc..those fields will use the form to validate purpose in the backend.
Form Action in HTML
Whenever we enter the data in the view page(user) using a browser, it will move to the backend. The HTML action needs some attributes to specify the request if; suppose we have a JSP page with servlet; the user enters the data in frontend those datas which handles using the form known as form data. The value of an HTML action attribute is nothing but a URL; there is no default value of HTML action attributes.
Syntax:
<html> <body> <form action="/controller pages(jsp,servlet,html,php)" method="get/post"> ………..Some html tags and user defined values….. </form> </body> </html>
The above syntax is the basics for creating the forms in html. It is the flow of navigating the web pages.
Examples of HTML Form Action
Following are the example of html form action as given below:
Example #1
Code:
<html>
<body>
<form action="C:\\Users\\SUN-4\\Documents\\New folder\\fisrst.jsp" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
<html>
<body>
<% String fname=request.getparameter("fname");%>
<% String lname=request.getparameter("lname");%>
<% out.println("Your input was received as:" +"FirstName=fname & LastName=lname");
%>
</body>
</html>
Output:
Code Explanation: In the above example, we will use the action page as JSP; after the user entered the data, it will validate from the jsp page and display the output on the browser screen.
Note: Whenever we use jsp, we need application servers like tomcat, jetty, WebLogic, etc.Example #2
Code:
<html>
<body>
<form id="form1" action="C:\\Users\\SUN-4\\Documents\\New folder\\fisrst.jsp" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("form1").action = "https://cdn.educba.com/fisrst.jsp";
document.getElementById("demo").innerHTML = "The value of the action attribute was changed to /fisrst.jsp.";
}
</script>
</body>
</html>
Output:
Code Explanation: In the above example, we will use the javascript function for navigating the web pages or not. If we use the javascript function in the HTML, it will more use of validation, alert the messages, and whatever the user-customized information is to be validated by the scripts. We use the DOM object that is the Document Object Model, a model for accessing the documents and is a platform and language-neutral interfaces that allow programs to dynamically access and update the content structure and styles of the user-defined datas.
Example #3
Code:
<html>
<style>
body {
color: yellow;
height: 100vh;
background:Green;
text-align: center;
}
input {
width: 315px;
padding: 8px;
background: Green;
border-radius: 20px;
}
::placeholder {
color: Green;
}
.btn {
background:Green;
height: 200px;
width: 300px;
}
</style>
<body>
<form id="form1" action="C:\\Users\\SUN-4\\Documents\\New folder\\fisrst.jsp" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
</form>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("form1").action = "https://cdn.educba.com/fisrst.jsp";
document.getElementById("demo").innerHTML = "The value of the action attribute was changed to /fisrst.jsp.";
}
</script>
</body>
</html>
Output:
Code Explanation: The above example is the basic purpose; whenever we develop the web page, it will need to satisfy the user requirements and be more attractive on the user side. Only the user will be more interested in using our Applications. So the above example, we use CSS Style in the form page is one of the more attractive and interacts with the user side.
Send Emails Using HTML Forms
It is one of the best features for web developers by using the browsers to allow them to route the form directly to a user email address after submission and is one of the ideas, but the reason is that if the browsers allowed emailing directly from the web form page that also will reveal the visitor’s email address directly, it also affects the users data. The hacker can collect the user information easily from the email address of the user web page and then spam it.
In order to protect the web users, no client-side language can send an email directly without the user interventions. We can set the form action field like as “mailto”, using this case, the browser invokes the mail client to send the form submission to the particular email address, which is to be user-specified.
Example:
<form action="mailto:[email protected]">
Generally, HTML form has two parts: the user point of view, that is, the front end form that you see in the browser screen, and the second is a back-end script that runs on the web servers. Your web browsers display the form using some HTML codes; after submitting the form, the browser sends the information whatever you submitted data in the form to the backend.
Some links we have defined in the above examples.
<form action="https://cdn.educba.com/First.jsp">
The browser will pick the URL mentioned in the form of action attributes and send the data to that URL, using web servers passes the form submission data to the script in the action URL(example.jsp). Now the backend scripts also send emails after submitted for the form data to the database.
Send Mail Using jsp
Here we discuss how to send mail using jsp:
<%@ page import = "java.io.*,java.util.*,javax.mail.*"%>
<%@ page import = "javax.mail.internet.*,javax.activation.*"%>
<%@ page import = "javax.servlet.http.*,javax.servlet.*" %>
<%
String result;
// Recipient's email ID needs to be mentioned.
String to = "[email protected]";
// Sender's email ID needs to be mentioned
String from = "[email protected]";
// Assuming you are sending email from localhost
String host = "localhost";
// Get system properties object
Properties properties = System.getProperties();
// Setup mail server
properties.setProperty("mail.smtp.host", host);
// Get the default Session object.
Session mailSession = Session.getDefaultInstance(properties);
try {
// Create a default MimeMessage object.
MimeMessage message = new MimeMessage(mailSession);
// Set From: header field of the header.
message.setFrom(new InternetAddress(from));
// Set To: header field of the header.
message.addRecipient(Message.RecipientType.TO,
new InternetAddress(to));
// Set Subject: header field
message.setSubject("Subject!");
// Now set the actual message
message.setText("Message");
// Send message
Transport.send(message);
result = "Sent message successfully....";
} catch (MessagingException mex) {
mex.printStackTrace();
result = "Error: unable to send message....";
}
%>
<html>
<body>
<center>
<h1>Send Email using JSP</h1>
</center>
<p align = "center">
<%
out.println("Result: " + result + "\n");
%>
</p>
</body>
</html>
Output:
Explication du code : Dans les exemples de programmes ci-dessus, nous avons déjà noté les informations utilisant certains serveurs d'applications pour exécuter les codes ci-dessus ; il enverra l'e-mail à l'aide de programmes jsp.
Conclusion
Dans les dernières technologies, nous disposons de nombreuses fonctionnalités pour réduire la charge de travail et avons la responsabilité de mettre à jour les connaissances au quotidien. La même chose en HTML et HTML5 est que la dernière version du HTML a les mêmes fonctionnalités mais quelques étapes supplémentaires pour la compatibilité des navigateurs. Nous devons vérifier chaque fois que nous utilisons HTML et que HTML 5 est pris en charge ou non par les navigateurs. Nous avons de nombreuses fonctionnalités en HTML, comme indiqué plus tard.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undress AI Tool
Images de déshabillage gratuites
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Comment ajouter une icône à l'onglet Titre de votre site Web dans HTML
Aug 07, 2025 pm 11:30 PM
Pour ajouter une icône à la barre de titre du site Web, vous devez lier un fichier Favicon dans une partie du HTML. Les étapes spécifiques sont les suivantes: 1. Préparez un fichier d'icône 16x16 ou 32x32 pixels. Il est recommandé d'utiliser Favicon.ico pour le nommer et le placer dans le répertoire racine du site Web, ou utiliser des formats modernes tels que PNG et SVG; 2. Ajouter des balises de liaison à HTML, telles que les formats PNG ou SVG, ajustez l'attribut de type en conséquence; 3. Ajouter éventuellement des icônes haute résolution pour les appareils mobiles, tels que AppletouCon, et spécifiez différentes tailles via l'attribut de tailles; 4. Suivez les meilleures pratiques, placez l'icône dans le répertoire racine pour assurer la détection automatique, effacer le cache du navigateur après la mise à jour et vérifier l'exactitude du chemin du fichier.
Quel est l'attribut ReadOnly dans HTML5?
Aug 08, 2025 am 11:55 AM
ThereadonlyAttributeInhtml5 makesforminputsnon-éditable qui a été le nombre
Comment créer un sélecteur de couleurs sous une forme HTML5?
Aug 08, 2025 am 03:48 AM
Utilisez Type = "Color" pour créer un sélecteur de couleur HTML5, 1. Utilisez Ajouter une entrée de couleur; 2. Vous pouvez définir la valeur de couleur par défaut via l'attribut de valeur (doit être dans un format hexadécimal à 7 caractères tels que #FFFFFF); 3. Tous les navigateurs modernes le soutiennent et les navigateurs plus anciens retomberont à l'entrée de texte; 4. Vous pouvez prévisualiser les changements de couleur en temps réel avec JavaScript; 5. Les balises d'étiquette doivent être ajoutées pour améliorer l'accessibilité, et la bibliothèque JavaScript peut être utilisée pour fournir un support de dégradation lorsque cela est nécessaire. Cette méthode est simple, efficace et largement prise en charge.
Comment implémenter un formulaire de contact de base dans HTML5?
Aug 08, 2025 am 04:57 AM
Utilisez des éléments et définissez des propriétés telles que l'action, la méthode, etc. pour spécifier l'adresse et la méthode de soumission des données; 2. Ajoutez des types d'entrée HTML5 tels que type = "e-mail" et les attributs requis pour atteindre la sémantique et la vérification de base; 3. Pertinent pour l'ID de boîte d'entrée via l'étiquette pour l'attribut, améliorez l'accessibilité et enveloppez chaque ensemble de balises et boîtes d'entrée avec P ou Div pour optimiser la structure; 4. La soumission du formulaire nécessite un traitement back-end et les services tiers tels que Formspree peuvent être remplacés lors des tests; 5. Améliorer éventuellement la vérification du client via JavaScript, mais la vérification HTML5 native peut répondre aux besoins de base, et enfin, vérifier et nettoyer les données du côté serveur pour assurer la sécurité.
Comment pouvez-vous rendre un élément HTML modifiable par l'utilisateur?
Aug 11, 2025 pm 05:23 PM
Oui, vous pouvez rendre les éléments HTML modifiables en utilisant l'attribut satisfait. La méthode spécifique consiste à ajouter un contenudtable = "true" à l'élément cible. Par exemple, vous pouvez modifier ce texte et l'utilisateur peut cliquer directement et modifier le contenu. Cet attribut convient aux éléments au niveau du bloc et en ligne tels que Div, P, Span, H1 à H6. La valeur par défaut est "vrai" pour être modifiable, "False" n'est pas éditable, et "hériter" pour hériter des paramètres de l'élément parent. Afin d'améliorer l'accessibilité, il est recommandé d'ajouter tabindex = "0 & quo
Comment créer une page Web HTML5 simple
Aug 12, 2025 am 11:51 AM
Pour créer une page Web HTML5 simple, vous devez d'abord utiliser le type de document de déclaration, puis créer une structure de base contenant, et, qui définit l'encodage, la fenêtre et le titre, ajoutez du contenu visible tel que le titre, le paragraphe, le lien, les images et les listes. Enregistrez-le en tant que fichier .html et ouvrez-le directement dans le navigateur pour la visualisation, sans support de serveur. C'est la base d'une page HTML5 complète et efficace.
Quel est l'élément de côté dans HTML5?
Aug 12, 2025 pm 04:37 PM
Les éléments devraient être utilisés pour le contenu.
Comment créer une disposition HTML réactive
Aug 07, 2025 pm 11:47 PM
Des balises de méta de la fenêtre doivent être ajoutées pour s'assurer que la page est correctement rendue par les appareils mobiles. 2. À l'aide d'une méthode de conception mobile d'abord, écrivez d'abord des styles de base pour les petits écrans, puis s'adaptez au grand écran via les requêtes multimédias. 3. Utilisation de Flexbox ou de grille pour créer une disposition de grille réactive flexible. 4. Assurez-vous que l'image est à l'échelle de manière adaptative sur différents appareils via la largeur maximale: à 100%, en vous assurant que l'image est à l'échelle de l'adaptation sur différents appareils. 5. Prioriser les unités relatives telles que REM,%, VW plutôt que les valeurs de pixels fixes. 6. Utilisation d'outils de développement du navigateur et combinant de vrais appareils pour les tests multi-scènes. 7. Gardez la mise en page simple et accessible, utilisez un HTML sémantique et assurez-vous que la zone tactile est suffisamment grande et finalement obtenir une disposition Web réactive qui fonctionne bien sur tous les appareils.
