Let’s say the following is our button −
<button id="submitForm">Submit</button>
On the basis of button id, on form submission, generate an alert −
$("#submitForm").click(function() { alert("The Form has been Submitted."); });
Example
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initialscale=1.0"> <title>Document</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> </head> <body> CollegeId=<input id="collegeId" type="text"><br /> CollegeName= <input id="collegeName" type="text"><br /> <button id="submitForm">Submit</button> <script> $("#submitForm").click(function() { alert("The Form has been Submitted."); }); </script> </body> </html>
To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.
Output
This will produce the following output −
After clicking the button, you can see the following output −