Jadual Kandungan
Form Action in HTML
Examples of HTML Form Action
Example #3
Send Emails Using HTML Forms
Send Mail Using jsp
Kesimpulan
Rumah hujung hadapan web html tutorial Tindakan Borang HTML

Tindakan Borang HTML

Sep 04, 2024 pm 04:44 PM
html html5 HTML Tutorial HTML Properties HTML tags

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>
Salin selepas log masuk

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>
Salin selepas log masuk

Output:

Tindakan Borang HTML

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>
Salin selepas log masuk

Output:

Tindakan Borang HTML

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>
Salin selepas log masuk

Output:

Tindakan Borang HTML

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&#160;protected]">
Salin selepas log masuk

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">
Salin selepas log masuk

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&#160;protected]";
// Sender's email ID needs to be mentioned
String from = "[email&#160;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>
Salin selepas log masuk

Output:

Tindakan Borang HTML

Penjelasan Kod: Dalam contoh program di atas, kami telah mencatat maklumat menggunakan beberapa pelayan aplikasi untuk menjalankan kod di atas; ia akan menghantar e-mel menggunakan program jsp.

Kesimpulan

Dalam teknologi terkini, kami mempunyai banyak ciri untuk mengurangkan beban kerja dan mempunyai tanggungjawab untuk mengemas kini pengetahuan dari hari ke hari. Perkara yang sama dalam HTML dan HTML5 ialah versi terkini HTML mempunyai ciri yang sama tetapi beberapa langkah lagi untuk keserasian penyemak imbas. Kita perlu menyemak bila-bila masa kita menggunakan HTML dan HTML 5 disokong oleh pelayar atau tidak. Kami mempunyai banyak ciri dalam HTML, seperti yang dibincangkan kemudian.

Atas ialah kandungan terperinci Tindakan Borang HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Tutorial Java
1653
14
Tutorial PHP
1251
29
Tutorial C#
1224
24
Sempadan Jadual dalam HTML Sempadan Jadual dalam HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Jadual Bersarang dalam HTML Jadual Bersarang dalam HTML Sep 04, 2024 pm 04:49 PM

Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.

HTML jidar-kiri HTML jidar-kiri Sep 04, 2024 pm 04:48 PM

Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.

Susun Atur Jadual HTML Susun Atur Jadual HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Pemegang Tempat Input HTML Pemegang Tempat Input HTML Sep 04, 2024 pm 04:54 PM

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

Senarai Tertib HTML Senarai Tertib HTML Sep 04, 2024 pm 04:43 PM

Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing

Butang onclick HTML Butang onclick HTML Sep 04, 2024 pm 04:49 PM

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.

Memindahkan Teks dalam HTML Memindahkan Teks dalam HTML Sep 04, 2024 pm 04:45 PM

Panduan untuk Memindahkan Teks dalam HTML. Di sini kita membincangkan pengenalan, cara teg marquee berfungsi dengan sintaks dan contoh untuk dilaksanakan.

See all articles