In this example first the request
goes from view.jsp to client.jsp and ajax code will be execute.
jQuery Syntax
The jQuery syntax is tailor
made for selecting HTML elements and performing some action on
the element(s).
Basic syntax is: $(selector).action()
- A $ sign to define/access jQuery
- A (selector) to "query
(or find)" HTML elements
- A jQuery action() to
be performed on the element(s)
You might have noticed that
all jQuery methods in our examples, are inside a document ready event:
$(document).ready(function(){
// jQuery methods go here...
});
// jQuery methods go here...
});
Example:
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
àview.jsp
<%@ taglib
uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />
<portlet:renderURL var="go">
<portlet:param name="jspPage"
value="/html/simple/simple.jsp">
</portlet:param>
</portlet:renderURL>
<a href="<%=go%>">goto client page<</a>
àClient.jsp
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>This is a
heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>
</body>
</html>
Output:
This is a heading
This is a paragraph.
This is another paragraph.
Click me