Thursday 1 October 2015

@RequestParam Annotation Example


Example 1 : 

@RequestMapping(value="call31" ,params="name", method=RequestMethod.GET)
public String method1(@RequestParam("name") String name) {
return "page1";
}

Example URL :

http://localhost:8888/SpringMVC/spring/call31?name=Ram

==========================================

Example 2 :

@RequestMapping(value="call32" ,params={"name","no"}, method=RequestMethod.GET)
public String method2(@RequestParam("name") String name,@RequestParam("no") String no) {
return "page1";
}

Example URL :

http://localhost:8888/SpringMVC/spring/call32?name=Ram&no=25

================================================

Example 3 : With POST method

@RequestMapping(value="call33Submit" ,params="sub", method=RequestMethod.POST)
public String method4(@RequestParam("sub") String name) {
return "page3Result";
}

This is POST method , so to call this method we need to add extra parameter as name="sub" for button or sumbit button , then only we can call this method 

JSP :

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page3.jsp</h1>
<form:form action="./call33Submit" method="POST">
<input type="submit" name="sub" value="Submit"/>
</form:form>
</body>
</html>

================================================

Full Example  :

web.xml :

<servlet>
<servlet-name>spring</servlet-name>
<!-- By default it will search for spring-servlet.xml file -->
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>spring</servlet-name>
<url-pattern>/spring/*</url-pattern>
</servlet-mapping>
</web-app>

spring-servlet.xml :

<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="
        http://www.springframework.org/schema/beans     
        http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
        http://www.springframework.org/schema/mvc 
        http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
        http://www.springframework.org/schema/context 
        http://www.springframework.org/schema/context/spring-context-3.2.xsd">

<context:component-scan base-package="com.ram" />
<mvc:annotation-driven />
<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/views/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>

</beans>

Controller :

package com.ram;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;

@Controller
public class RequestParamExample {
//http://localhost:8888/SpringMVC/spring/call31?name=Ram
@RequestMapping(value="call31" ,params="name", method=RequestMethod.GET)
public String method1(@RequestParam("name") String name) {
return "page1";
}
//http://localhost:8888/SpringMVC/spring/call32?name=Ram&no=25
@RequestMapping(value="call32" ,params={"name","no"}, method=RequestMethod.GET)
public String method2(@RequestParam("name") String name,@RequestParam("no") String no) {
return "page1";
}
@RequestMapping(value="call33" , method=RequestMethod.GET)
public String method3() {
return "page3";
}
//to call this method add extra parameter as name="sub" for button or sumbit button then only this method will call
@RequestMapping(value="call33Submit" ,params="sub", method=RequestMethod.POST)
public String method4(@RequestParam("sub") String name) {
System.out.println("name : "+name);
return "page3Result";
}
}

page1.jsp :

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page1.jsp</h1>
</body>
</html>

page3.jsp :

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page3.jsp</h1>
<form:form action="./call33Submit" method="POST">
<input type="submit" name="sub" value="Submit"/>
</form:form>
</body>
</html>

page3Result.jsp :

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page3Result.jsp</h1>
</body>
</html>




@Path Variable Annotation Examples

Example 1 : 

@RequestMapping(value="call21/{name}" , method=RequestMethod.GET)
public String method1(@PathVariable("name") String name) {

return "page1";
}

Example URL :

http://localhost:8888/SpringMVC/spring/call21/Ram

=====================================

Example 2 : 

@RequestMapping(value="call22/{name}/{no}" , method=RequestMethod.GET)
public String method2(@PathVariable("name") String name,@PathVariable("no") String no) {
return "page1";
}


Example URL : 

http://localhost:8888/SpringMVC/spring/call22/Ram/25

=======================================

Example 3 : 

@PathVariable with POST method : 

@RequestMapping(value="call2222/{name}/{no}" , method=RequestMethod.POST)
public String method3(@PathVariable("name") String name,@PathVariable("no") String no) {
return "page1";
}

This is POST method , so Passing extra Path variables from jsp as 

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page8.jsp</h1>
<form:form action="./call2222/Ram/21" method="POST">
<input type="submit" value="Submit"/>
</form:form>
</body>
</html>

==============================================

Full Example :

Web.xml : 

<web-app>

<servlet>
<servlet-name>spring</servlet-name>
<!-- By default it will search for spring-servlet.xml file -->
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>

<servlet-mapping>
<servlet-name>spring</servlet-name>
<url-pattern>/spring/*</url-pattern>
</servlet-mapping>


</web-app>

spring-servlet.xml : 

<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="
        http://www.springframework.org/schema/beans     
        http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
        http://www.springframework.org/schema/mvc 
        http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
        http://www.springframework.org/schema/context 
        http://www.springframework.org/schema/context/spring-context-3.2.xsd">

<context:component-scan base-package="com.ram" />
<mvc:annotation-driven />

<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/views/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>

</beans>


Controller : 

package com.ram;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

@Controller
public class PathVariableEx {


//http://localhost:8888/SpringMVC/spring/call21/Ram
@RequestMapping(value="call21/{name}" , method=RequestMethod.GET)
public String method1(@PathVariable("name") String name) {

return "page1";
}

//http://localhost:8888/SpringMVC/spring/call22/Ram/25
@RequestMapping(value="call22/{name}/{no}" , method=RequestMethod.GET)
public String method2(@PathVariable("name") String name,@PathVariable("no") String no) {

return "page1";
}

@RequestMapping(value="call222" , method=RequestMethod.GET)
public String method222() {

return "page8";
}

//use like this in jsp page <form:form action="./call2222/Ram/21" method="POST"> to call this url with Path varilable
@RequestMapping(value="call2222/{name}/{no}" , method=RequestMethod.POST)
public String method3(@PathVariable("name") String name,@PathVariable("no") String no) {

return "page1";
}



}

page1.jsp : 

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page1.jsp</h1>
</body>
</html>

page8.jsp

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<body>
<h1>From page8.jsp</h1>
<form:form action="./call2222/Ram/21" method="POST">
<input type="submit" value="Submit"/>
</form:form>
</body>

</html>

Wednesday 12 August 2015

Select Radio button from a tr on click


If you click on tr (any row) also radio button will select 

<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>


<table border="2" cellpadding="5">
      <tr>
      <td>1 </td><td>Java </td><td><input type="radio" id="one" name="numbers">One</input></td>
      </tr>
      <td>2 </td><td>JQuery </td><td><input type="radio" id="two" name="numbers">Two</input></td>
      </tr>
      <td>3 </td><td>Ajax </td><td><input type="radio" id="three" name="numbers">Three</input></td>
      </tr>
</table>
<script>
$(document).ready(function() {

$("tr").bind("click",function () {

$(this).find('td input:radio').prop('checked', true);

});

});
</script>

Thursday 6 August 2015

Spring @RequestMapping Annotation

=> Based on this Annotation only Request will come to any method in the Controller.

=> We can mention that , the method is supporting either POST request or GET request

=> We can mention the value of the url 
(Ex : http://ip:port/projName/..../value)
For each method we have to differentiate the value

=> We can append variables with URL as Path Variables

=> We can append variables with URL as Request Parameters

Annotation 

@RequestMapping

import org.springframework.web.bind.annotation.RequestMapping;

How to specify the method is only supports either POST / GET ?

@RequestMapping(value="/callController1", method=RequestMethod.GET)

@RequestMapping(value="/callController1", method=RequestMethod.POST)

@RequestMapping(value="/callController1", method={RequestMethod.GET,RequestMethod.POST})
[It will support both GET and POST Requests]


@PathVariable Example

@RequestMapping(value="/callController2/{name}",method=RequestMethod.GET)

public ModelAndView method2(@PathVariable("name") String person) {
           // Write the Code whatever you want
}

Ex URL : http://localhost:8888/SpringMVC/spring/callController2/Ram

For More Path variables 

@RequestMapping(value="/callController2/{name}/one/{salary}",method=RequestMethod.GET)

Ex URL : http://localhost:8888/SpringMVC/spring/callController2/Ram/one/50000

@RequestParam with Params attribute

@RequestMapping(value="/callController3",params="id",method=RequestMethod.GET)
public ModelAndView method3(@RequestParam("id") String uid) {
// Code

}

Ex URL : http://localhost:8888/SpringMVC/spring/callController3?id=25

For Multiple Request Parameters

@RequestMapping(value="/callController5",params={"id","name"},method={RequestMethod.GET,RequestMethod.POST})
public ModelAndView method5(@RequestParam("id") String uid,@RequestParam("name") String name) {
// Code

}

Ex URL : http://localhost:8888/SpringMVC/spring/callController5?id=25&name=Ram


Example :

package com.ram;

import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.servlet.ModelAndView;

@Controller
public class SpringMvcController {

//http://localhost:8888/SpringMVC/spring/springController
//By default it will support GET method
@RequestMapping(value="/springController")
public String method() {

return "returnPage";

}

//http://localhost:8888/SpringMVC/spring/callController1
@RequestMapping(value="/callController1",method=RequestMethod.GET)
public String method1(ModelMap model) {

model.addAttribute("key1", "Hi Ram");

return "returnPage1";

}

//http://localhost:8888/SpringMVC/spring/callController2/Ram
@RequestMapping(value="/callController2/{name}",method=RequestMethod.GET)
public ModelAndView method2(@PathVariable("name") String person) {

ModelAndView model = new ModelAndView();
model.setViewName("returnPage2");
model.addObject("msg1", person);
model.addObject("msg2", "This is Message2");

return model;

}

//http://localhost:8888/SpringMVC/spring/callController3?id=25
//It will suppoert Both POST and GET
@RequestMapping(value="/callController3",params="id",method={RequestMethod.GET,RequestMethod.POST})
public ModelAndView method3(@RequestParam("id") String uid) {

ModelAndView model = new ModelAndView();
model.setViewName("returnPage3");
model.addObject("msg1", uid);

return model;

}



//http://localhost:8888/SpringMVC/spring/callController4
@RequestMapping(value="/callController4",method=RequestMethod.GET)
public ModelAndView method4() {

ModelAndView model = new ModelAndView("returnPage4");
model.addObject("msg5", "Hi Ram");

return model;

}

//http://localhost:8888/SpringMVC/spring/callController5?id=25&name=Ram
//It will suppoert Both POST and GET
@RequestMapping(value="/callController5",params={"id","name"},method={RequestMethod.GET,RequestMethod.POST})
public ModelAndView method5(@RequestParam("id") String uid,@RequestParam("name") String name) {

ModelAndView model = new ModelAndView();
model.setViewName("returnPage5");
model.addObject("id", uid);
model.addObject("name", name);

return model;

}

}

spring-servlet.xml

<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xsi:schemaLocation="
        http://www.springframework.org/schema/beans     
        http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
        http://www.springframework.org/schema/mvc 
        http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
        http://www.springframework.org/schema/context 
        http://www.springframework.org/schema/context/spring-context-3.2.xsd">

<context:component-scan base-package="com.ram" />

<mvc:annotation-driven />

<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/views/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>

</beans>


Web.xml

<web-app> <display-name>Spring MVC</display-name> <welcome-file-list> <welcome-file>home.jsp</welcome-file> </welcome-file-list>
<servlet> <servlet-name>spring</servlet-name> <servlet-class>org.springframework.web.servlet.DispatcherServlet
</servlet-class>
<load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>spring</servlet-name> <url-pattern>/spring/*</url-pattern> </servlet-mapping> </web-app>

returnPage.jsp

<html> <body> <h1>Spring MVC</h1> </body> </html>

returnPage1.jsp

<html> <body> <h1>Spring MVC</h1> <h2>${key1}</h2> </body> </html>

returnPage2.jsp

<html> <body> <h1>Spring MVC</h1> <h2>${msg1}</h2> <h2>${msg2}</h2> </body> </html>

returnPage3.jsp

<html> <body> <h1>Spring MVC</h1> <h2>${msg1}</h2> </body> </html>

returnPage4.jsp

<html> <body> <h1>Spring MVC</h1> <h2>${msg5}</h2> </body> </html>

returnPage5.jsp

<html> <body> <h1>Spring MVC</h1> <h2>Id : ${id}</h2> <h2>Name : ${name}</h2> </body> </html>







Wednesday 5 August 2015

JQuery Device Detector [Mobile Device]

JQuery Device Detector [Mobile Device / IPad / IPhone / Other]

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
            $(document).ready(function() {
                     fun();
            });
</script>

<script>
function fun() {

var device = navigator.userAgent;
var checker = {
      microsoft: device.match(/IEMobile/),
      ipad: device.match(/(iPad)/),
     iphone: device.match(/(iPhone)/),
     blackberry: device.match(/BlackBerry/),
     android: device.match(/Android/)
   };
   if (checker.microsoft){
    alert("Microsoft");
   }
   else if(checker.ipad) {
   alert("ipaD");
   }
   else if (checker.iphone){
       alert("iphone...");
   }
   else if (checker.blackberry){
       alert("BlackBerry");
   }
   else if(checker.android) {
    alert("Android");
 }
   else {
       alert("Unknown Device/Desktop .... ");
   }
};
</script>
</head>
<body>


</body>
</html>

Tuesday 4 August 2015

JQuery Back button [Go to previous page]

For Go to previous page use following method

parent.history.back();

[OR]

document.referrer;

A.html

<html>
<body>
From Page A
<a href="C.html">Next</a>
</body>
</html>

B.html

<html>
<body>
From Page B
<a href="C.html">Next</a>
</body>
</html>

C.html

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>

$(document).ready(function(){
   $("#back").click(function() {
parent.history.back();
});
});


 /* $(document).ready(function(){
   $("#back").click(function() {
   var previousPage =  document.referrer;
window.location.href = previousPage;
});

}); */

</script>
</head>
<body>
From Page C ...
<button id="back">Back</button>
</body>
</html>

Sunday 7 June 2015

Difference between keyup,keydown and keypress events

* keydown , keypress both the events are same , this events will rise/fire whenever we click the key button

* keyup event will rise whenever we click and release key button 


* keyup and keydown both are case insensitive 

It means a , A , other languages also that button will return always same value

* Control buttons like Home,Delete,PageUp,PageDown,Backspace,Space,Tab,CapsLock,Shift,Ctr,Alt,Arrow button will work only for keydown and keyup event , these buttons will not work with keypress event


* keypress event will return the keyboard values based on the language you selected and it depends on case sensitive.


Key Down Event

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {
$("#keydownId").keydown(function(e) {
functionOne(e);
});
});
</script>
<script>
function functionOne(key) {
alert(key.which);
}
</script>
</head>
<body>
<div>
KeyDown Event <input type="text" id="keydownId"/>
</div>
</body>
</html>

Key Up Event

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {
$("#keyupId").keyup(function(e) {
functionOne(e);
});
$("#getVal").click(function(e) {
var val = $("#keyupId").val();
alert(val);
});
});
</script>
<script>
function functionOne(key) {
alert(key.which);
}
</script>
</head>
<body>
<div>
KeyUp Event <input type="text" id="keyupId"/>
Click to Get Value <button id="getVal">Get Val</button>
</div>
</body>
</html>

Key Press Event

<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function() {
$("#keypressId").keypress(function(e) {
functionOne(e);
});
});
</script>
<script>
function functionOne(key) {
alert(key.which);
}
</script>
</head>
<body>
<div>
KeyPress Event <input type="text" id="keypressId"/>
</div>
</body>
</html>