Showing posts with label web page. Show all posts
Showing posts with label web page. Show all posts

Wednesday, March 20, 2013

comment_icon 0 Handling Session in JSP

In this Tutorial we are going to see that how can we Handle SESSION in JSP.


1. Setting Session : 

Before we validate or check the existing session it is important to know that how we set session in JSP. 
we use session.setAttribute("ATTRIBUTE NAME","ATTRIBUTE VALUE"); you can set as many attribute as you want.

2. Retrieving valuse from session attribute

To retrieve value from session attribute we use  following method. session.getAttribute("attribute name");
to store the retrieved value in a variable we write code as shown below.
 data-type variable-name=(data type cast)session.getAttribute("attribute name");
e.g.  String  signin=(String)session.getAttribute("username");

3. Ending or Invalidating session.

To End the current session and all attributes value we use session.invalidate(); method.

4. To Prevent user from going back to the previous page after logout put following META-TAG in every page's Header

<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"> 


working Example 

 1. index.jsp


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><%@page
 language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
 <html>
<head>
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"> 
<title>index</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<% String  signin=(String)session.getAttribute("username");
 
 if(signin==null) { 
/** perform some your own logic for not signed in user , i'm just forwarding to login page
 **/
  %> <a href="login.jsp">click to login</a>
 <%
 }
 else {
 
 /** logic for logges in users **/
  %>

<h3>successfull login</h3>
  <a href="logout.jsp">click to logout</a>
  <%} %>
</body>
</html>

2. Login.jsp


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><%@page
 language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
<html>
<head>
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"> 
<title>login</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<%
/** setting username here . you  will do it after processing login code **/
 session.setAttribute("username","your user's username");
 %>
 i set the session, now click on index page link to verify it
 <a href="index.jsp">go to index page</a>
</body>
</html>

3. Logout.jsp

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><%@page
 language="java" contentType="text/html; charset=ISO-8859-1"
 pageEncoding="ISO-8859-1"%>
<html>
<head>
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE"> 
<title>logout</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<% //session.setAttribute("username",null);
 session.invalidate();
 %> 
 <jsp:forward page="index.jsp"/>

</body>
</html>

Wednesday, February 27, 2013

comment_icon 0 Integrating Image slider to a Web Page

In this tutorial step by step i am going to expalin that how you can integrate slider into your web application.

Prerequisite

Download thie required files . i packed all required files in a zip , click Here to download zip if you Downloded the files . then extract them and folllow these steps.
  1. create a New HTML file or if you want to integrate in existing Page . create a New div tag whre ever you want and follow next step
  2. Copy all files to your project directory if you want to add this to existing Project
  3. add following files to your Headerof the Page
       
         <link rel="stylesheet" href="themes/default/default.css" type="text/css" media="screen" />
         <link rel="stylesheet" href="themes/light/light.css" type="text/css" media="screen" />
         <link rel="stylesheet" href="themes/dark/dark.css" type="text/css" media="screen" />
         <link rel="stylesheet" href="themes/bar/bar.css" type="text/css" media="screen" />
         <link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
       
       
  4. Add Following HTML to the Page
      
      <div class="slider-wrapper theme-default">
                <div id="slider" class="nivoSlider">
                    <img src="images/toystory.jpg" data-thumb="images/toystory.jpg" alt="" />
                    <a href="http://dev7studios.com"><img src="images/up.jpg" data-thumb="images/up.jpg" alt="" title="This is an example of a caption" /></a>
                    <img src="images/walle.jpg" data-thumb="images/walle.jpg" alt="" data-transition="slideInLeft" />
                    <img src="images/nemo.jpg" data-thumb="images/nemo.jpg" alt="" title="#htmlcaption" />
                </div>
                <div id="htmlcaption" class="nivo-html-caption">
                    <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>. 
                </div>
            </div>
      
      
    • In this above code img tag contain your sliding image . add as many as you want . yoou can replce image source to your own image source.
    • data-thumb attribute contains the thumbnail image url.
    • title attribute contains the caption you want to display
  5. Add following to bottom of your Page. we are adding at bottom so these scripts are loded after other load completes so deosn't affect your Page data.
    
      <script type="text/javascript" src="scripts/jquery-1.9.0.min.js"></script>
        <script type="text/javascript" src="jquery.nivo.slider.js"></script>
        <script type="text/javascript">
        $(window).load(function() {
            $('#slider').nivoSlider();
        });
        </script>
     
  6. if you still have doubt you can open demo.html and see the sample code.