Testing Tools

How to use JavaScript in JSP

Published

3 years ago

, on

2021-10-03

Rody

In this article, we will help all the Web Developers to get started with JavaScript and JavaServerPage.

Java Server page is often used at the development of server based applications. This server based application is no doubt very important in the modern webpage design and we also set standard security and validation process by JavaScript. So it is easy to say that JSP and JavaScript is interrelated with each other and thorough this way we can develop the page dynamically and process the pages. JavaScript is the Microsoft implementation of the ECMA 262 language specification. Java Script is a language that is full implementation with some enhancements that take advantage of capabilities of Microsoft Internet Explorer.

Java Script is an object oriented event driven scripting language. This language is supports us communicating with various dynamic scripting languages. Java Script is no doubt very popular to server side developers. We know that modern world is running with online based systems. This online based system directly interacts with sever and also checking different types of event processing which we use regularly. So at first we have to know different event handling procedures of Java Script as well as the features of JavaScript. As Java Script is very popular language so let us check why it is more important? Now discussing about Java Script!

Features of JavaScript

Following are some important features of JavaScript:

JavaScript is a Scripting Language.
JavaScript is lightweight.
JavaScript can be inserted into HTML pages and also call from the HTML pages.
JavaScript inserted into HTML pages can be executed by all modern web browsers like IE, FF, and Opera etc.
Java Script model can work easily with Java Server Page application model.

Java Server Page Alert is used to put the validation on login page for the users. The example in this Article provides to create the validation on the login form using JavaScript method in JSP (Java Server Page). The Article demonstrates an elaborative example to create alert box in a JSP page. Now we create a JSP file with name “validation.jsp”. The validation message surrounds the code for User Login page that include the ‘LoginName’ and ‘Password’. If we use to apply the validation we make use of JavaScript method in validation.jsp to validate the LoginName and password. Now here we set submit button in Java Server Page to call a JavaScript’s function validlogin (). The function validlogin () is used to validate the username and password in JSP (Java Server Page). Now if the username and password field is not inserted by the user then this will display mistake message using “alert ()”. The function also ensures that the field username and password must not be blank otherwise it will display only the message “Welcome mrbool readers “.

Listing 1: Showing sample validation

<html>
<head>
<script>
function validLogin() // java script function is created
{
if(document.frm1.userName.value == "")
{
alert ( "Please enter mrbool Login Name." ); //java script message will be display
document.loginform.userName.focus();
return false;
}
if (document.frm1.pass.value == "")
{
alert ( "Please Enter your secret password….." );
document.userform.password.focus();
return false;
}
alert("Welcome mrbool readers" );
return true;
}
</script>
</head>
<body>
<form name="frm1" method="post" onsubmit="return validLogin();">
<table width="150px" border=0 style="background-color: H0080FF80;">
<tr><td colspan=2 align="center" style="font-weight:bold;font-size:20pt;" align="center"><b>B.C.E.I User Login Form.</b></td>
</tr>
<tr><td colspan=2> </td>
</tr>
<tr><td style="font-size:12pt;" align="center">Enter login Name:</td>
<td><input type="text" name="userName" value=""></td>
</tr>
<tr><td style="font-size:12pt;" align="center">Enter Password:</td>
<td><input type="password" name="password" value=""></td>
</tr>
<tr>
<td></td>
<td><input type="submit" name="Submit" value="Login as B.C.E.I User’s"></td>
</tr>
</table>
</form>
</body>
</html>

We have deliberated the allocation about JSP. JSP is server side scripting language as we know but at this point it should be remembered that in real world programming we need more than JSP. Assume that we have an html (Hypertext markup language) form (Html form that contains only html tags in this page no JSP code is present) having username text field, and password field. As this is login id page so much more security should be present here. Before submitting the page to web server, it should be validate HTML (Hypertext markup language) field data. These types of validation can be done on client side instead of directly on server side. It should be done on client side, because it is very fast than server side validation process. If user data is not of specified range of standard validation program then it should be shown as an error at client browser of the user. This form will not jump to action page (server) until it is fully validated.

Listing 2: Sample showing form validation

<%@ page contentType="text/html; charset=iso-8859-1" language="java" %>
<html>
<head>
<script>
function validateForm()
{
    if(document.frm.username.value=="")
    {
      alert("User Name should not be blank..");
      document.frm.username.focus();
      return false;
    }
    else if(document.frm.pwd.value=="")
    {
      alert("Password should not be blank");
      document.frm.pwd.focus();
      return false;
    }
}
</script>
</head>
<body>
<form name="frm" method="get" action="validity.jsp" onSubmit="return validateForm()">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="22%"> </td>
    <td width="78%"> </td>
    </tr>
  <tr>
    <td>Enter UserName </td>
    <td><input type="text" name="username" /></td>
  </tr>
  <tr>
    <td>Enter Password</td>
    <td><input type="text" name="pwd" /></td>
  </tr>
  <tr>
    <td> </td>
    <td><input type="submit" name="submit" value="Submit"></td>
    </tr>
  <tr>
    <td> </td>
    <td> </td>
    </tr>
</table>
</form>
</body>
</html>

When we submit this form to web server, first it will check and validate the form. At the onSubmit=”return validateForm()” event check validateForm() function in javascript, and if any field is blank then it will throw an error alert on browser. This submit is successful only when validateForm() function returns true. Then goes to next form validateInput.jsp of JSP page.

This is an example implemented here to develop JSP code with JavaScript program model. The model program is a database related program. Here we create a database program and setup deletion operation and through this deletion operation user can delete the data. After deletion a message will be displayed using java script alert process. This way we can also print alert message for updating and insertion process.

Some point should be remembered that when we wish to print the document then this java script code helps us to develop this operation.

Listing 3: Sample showing database driven operation

<%@ page language="java" import="java.lang.*" import="java.sql.*" %>
<%
Connection con = null;
String url = "jdbc:mysql://127.0.0.1:3306/";	//my sql server IP 
String db = "cei"; // this is the database name
String driver = "com.mysql.jdbc.Driver"; //this is the driver name
String userName ="subrata"; //this is mysql user name
String password="srimani"; // this is mysql password
String str=request.getParameter("r1");
String sname=request.getParameter("sname");
String roll=request.getParameter("roll");
int stuID=Integer.parseInt(code);
try {
Class.forName(driver);
con = DriverManager.getConnection(url+db,userName,password);
String sql = "delete from cei_student where roll= ?";
PreparedStatement stmt=null;
stmt=con.prepareStatement(sql);
stmt.setInt(1,stuId);
int del=stmt.executeUpdate();
if(del==0) { %>
<script language="javascript">
alert("Deletion successful");	//Java Script alert message
</script>
<%
}
if(del==1) { %>
<script language="javascript">
alert("Deletion successful");
</script>
<%
}
stmt.close();
con.close();
out.println("Data delete successfully from database…..");
}
catch(Exception e) {
out.println(e);
}
%>

JavaScript exception solver – it is a JavaScript error online tool that can be used to detect and fix JavaScript errors on the client-side.

Conclusion

It is clear as day light that the Java Server Page is working on most of the online based systems that are running through various security level procedure and this security is totally written in the phase of JavaScript model. This JavaScript model is compatible with Java Server Page program. We can set email check, numeric check, alphabet check in the program segment process. So JS is The Best Way to implement security based program on the JSP platform.