Let's step through a simple example to see how the Seam
object works. First of all, let's create a new Seam component called helloAction
.
@Stateless
@Name("helloAction")
public class HelloAction implements HelloLocal {
public String sayHello(String name) {
return "Hello, " + name;
}
}
You also need to create a local interface for our new component - take special note of the @WebRemote
annotation, as it's required to make our method accessible via remoting:
@Local
public interface HelloLocal {
@WebRemote
public String sayHello(String name);
}
That's all the server-side code we need to write. Now for our web page - create a new page and import the following scripts:
<script type="text/javascript" src="seam/resource/remoting/resource/remote.js"></script>
<script type="text/javascript" src="seam/resource/remoting/interface.js?helloAction"></script>
To make this a fully interactive user experience, let's add a button to our page:
<button onclick="javascript:sayHello()">Say Hello</button>
We'll also need to add some more script to make our button actually do something when it's clicked:
<script type="text/javascript">
//<![CDATA[
function sayHello() {
var name = prompt("What is your name?");
Seam.Component.getInstance("helloAction").sayHello(name, sayHelloCallback);
}
function sayHelloCallback(result) {
alert(result);
}
// ]]>
</script>
We're done! Deploy your application and browse to your page. Click the button, and enter a name when prompted. A message box will display the hello message confirming that the call was successful. If you want to save some time, you'll find the full source code for this Hello World example in Seam's /examples/remoting/helloworld
directory.
So what does the code of our script actually do? Let's break it down into smaller pieces. To start with, you can see from the Javascript code listing that we have implemented two methods - the first method is responsible for prompting the user for their name and then making a remote request. Take a look at the following line:
Seam.Component.getInstance("helloAction").sayHello(name, sayHelloCallback);
The first section of this line, Seam.Component.getInstance("helloAction")
returns a proxy, or "stub" for our helloAction
component. We can invoke the methods of our component against this stub, which is exactly what happens with the remainder of the line: sayHello(name, sayHelloCallback);
.
What this line of code in its completeness does, is invoke the sayHello
method of our component, passing in name
as a parameter. The second parameter, sayHelloCallback
isn't a parameter of our component's sayHello
method, instead it tells the Seam Remoting framework that once it receives the response to our request, it should pass it to the sayHelloCallback
Javascript method. This callback parameter is entirely optional, so feel free to leave it out if you're calling a method with a void
return type or if you don't care about the result.
The sayHelloCallback
method, once receiving the response to our remote request then pops up an alert message displaying the result of our method call.