Difference between revisions of "Lab B.3: Adding Functionality"

From AgileApps Support Wiki
imported>Aeric
imported>Aeric
m (Text replace - '{domain}' to '{{domain}}')
 
(23 intermediate revisions by the same user not shown)
Line 13: Line 13:
Let's start by sending your name to the controller.
Let's start by sending your name to the controller.
<ol>
<ol>
<li>Click '''Designer > Logic > Pages'''
<li>Click '''[[File:GearIcon.png]] > Customization > Developer Resources > Pages'''
<li>Click <tt>Hello.jsp</tt>
<li>Click <tt>Hello.jsp</tt>
<li>Customize the form to pass your name to the controller. (You could also create a form field for that, but here will just hardcode the value.)
<li>Customize the form to pass your name to the controller. (You could also create a form field for that, but here will just hardcode the value.)
Line 35: Line 35:
depending on the results. But for now, we'll just pass along the data.)
depending on the results. But for now, we'll just pass along the data.)
<ol>
<ol>
<li>Click '''Designer > Logic > Classes'''
<li>Click '''[[File:GearIcon.png]] > Customization > Developer Resources > Classes'''
<li>Click <tt>HelloController</tt>
<li>Click <tt>HelloController</tt>
<li>Add the code to echo the incoming data and pass it to the target page:
<li>Add the code to echo the incoming data and pass it to the target page:
Line 41: Line 41:
     public ControllerResponse execute(HashMap params) throws Exception
     public ControllerResponse execute(HashMap params) throws Exception
     {
     {
         // Just to show we got it, and could process it if we wanted to
         // Just to show we got the parameters, and could process them if we wanted to
         String name = (String) params.get("name");
         String name = (String) params.get("name");
         Functions.debug("HelloController: Hal will greet "+name);
         Logger.info("HelloController: Hal will greet "+name, "HelloWorld");
          
          
         // Pass the parameters to the target page
         // Pass the parameters to the target page
Line 72: Line 72:
         // Just to show we got it, and could process it if we wanted to
         // Just to show we got it, and could process it if we wanted to
         String name = (String) params.get("name");
         String name = (String) params.get("name");
         Functions.debug("HelloController: Hal will greet "+name);
         Logger.info("HelloController: Hal will greet "+name, "HelloWorld");
          
          
         // Pass the parameters to the target page
         // Pass the parameters to the target page
Line 85: Line 85:
===Customize the Destination Page===
===Customize the Destination Page===
<ol>
<ol>
<li>Click '''Designer > Logic > Pages'''
<li>Click '''[[File:GearIcon.png]] > Customization > Developer Resources > Pages'''
<li>Click <tt>HelloWorld.jsp</tt>
<li>Click <tt>HelloWorld.jsp</tt>
<li>Put this code at the top of the page to access the data sent by the controller, using the {{Implicit JSTL Object}}, <tt>param</tt>:
<li>Put this code at the top of the page to access the data sent by the controller, using the {{Implicit JSTL Object}}, <tt>param</tt>:
Line 108: Line 108:
</syntaxhighlight>
</syntaxhighlight>
</li>
</li>
<li>Change the output line to use the name sent by the controller:
<li>And then change the output line to use that value:
:<syntaxhighlight lang="java" enclose="div">
:<syntaxhighlight lang="java" enclose="div">
<h1 align="center">Hello <%=name %>!</h1>
<h1 align="center">Hello <%=name %>!</h1>
Line 139: Line 139:


===Try It Out===
===Try It Out===
# Visit https://platform_url/networking/pages/Hello.jsp and click the button to see the results.
# Visit <nowiki>https://{{domain}}/networking/pages/Hello.jsp</nowiki>.<br>(For <tt>{{domain}}</tt>, substitute the URL you use to access the platform.)
# In the platform, click '''Designer > Global Resources > Debug Log''' to view the entry you made in the log.<br>If that window is already open, refresh it by click the "circled arrows" icon in the upper right: [[File:RefreshIcon.png]].
# Type in a name and click the button to see the results.
# In the platform, click '''[[File:GearIcon.png]] > [[File:GearIcon.png]] > Customization > Developer Resources > Debug Log''' to view the entry you made in the log.<br>If that window is already open, refresh it by clicking the "circling arrows" icon in the upper right: [[File:RefreshIcon.png]].
:You should see an entry like this:
:You should see an entry like this:
::[[File:DebugMessage.jpg]]
::[[File:DebugMessage.jpg]]


==Learn More==
==Learn More==
:* Visit the [{{DOCHOST}}/javadocs Platform APIs] to find out more about the methods in the ControllerResponse and Functions classes.
:* Platform [{{DOCHOST}}/javadocs/com/platform/api/ControllerResponse.html ControlerResponse] APIs
:* For a good introduction to JSP syntax, see http://java.sun.com/developer/technicalArticles/Programming/jsp/  
:*Platform [{{DOCHOST}}/javadocs/com/platform/api/Functions.html Functions]
:* For a quick reference table and additional notes, go here: http://www.apl.jhu.edu/~hall/java/Servlet-Tutorial/
:* [http://java.sun.com/developer/technicalArticles/Programming/jsp/ JSP syntax] 
 
:*{{Implicit JSTL Object}}s
<!--
<br>
;Next:
: [[HowTo:Classes, APIs, and Naming Conventions]]
<noinclude>


<br/>
;Next
: --Lab B.4: To Be Done--
-->
[[Category:Lab]]
[[Category:Lab]]
</noinclude>

Latest revision as of 19:18, 25 April 2014

Goals
  • Pass a value to a controller
  • Pass a value from the controller to a JSP page
  • Use the value in the JSP page
  • Use the Debug Log
Prerequisites

Exercise

Pass a Value to the Controller

Let's start by sending your name to the controller.

  1. Click GearIcon.png > Customization > Developer Resources > Pages
  2. Click Hello.jsp
  3. Customize the form to pass your name to the controller. (You could also create a form field for that, but here will just hardcode the value.)
    <p>Press the button to see something cool.</p>
    <form name="mainForm" action="/networking/controller/com/platform/demo/hello/HelloController?name={yourName}" 
       ...                                                                                      ~~~~~~~~~~~~~~~~
    
    For example:
    <p>Press the button to see something cool.</p>
    <form name="mainForm" action="/networking/controller/com/platform/demo/hello/HelloController?name=Fred" 
       ...
    

Customize the Controller

Next customize the controller to pass along data sent from the initial page. (You could do any processing you want here, and even select different targets, depending on the results. But for now, we'll just pass along the data.)

  1. Click GearIcon.png > Customization > Developer Resources > Classes
  2. Click HelloController
  3. Add the code to echo the incoming data and pass it to the target page:
        public ControllerResponse execute(HashMap params) throws Exception
        {
            // Just to show we got the parameters, and could process them if we wanted to
            String name = (String) params.get("name");
            Logger.info("HelloController: Hal will greet "+name, "HelloWorld");
            
            // Pass the parameters to the target page
            ControllerResponse cr = new ControllerResponse();
            cr.setData(params);
            cr.setTargetPage("HelloWorld.jsp");
            return cr;
        }
    

In this code, you echoed the incoming data to the Debug Log, before passing it to the target page. In the process, you identified where the message came from (HelloController), to make it easier to find in the log.

The controller should now look like this:

package com.platform.demo.hello;

import com.platform.api.*;
import java.util.HashMap;

public class HelloController implements com.platform.api.Controller
{
    public ControllerResponse execute(HashMap params) throws Exception
    {
        // Just to show we got it, and could process it if we wanted to
        String name = (String) params.get("name");
        Logger.info("HelloController: Hal will greet "+name, "HelloWorld");
        
        // Pass the parameters to the target page
        ControllerResponse cr = new ControllerResponse();
        cr.setData(params);
        cr.setTargetPage("HelloWorld.jsp");
        return cr;
    }
}

Customize the Destination Page

  1. Click GearIcon.png > Customization > Developer Resources > Pages
  2. Click HelloWorld.jsp
  3. Put this code at the top of the page to access the data sent by the controller, using the Implicit JSTL Object, param:
    <%@ taglib uri="/c" prefix="c" %>
    <h1 align="center">Hello ${param.name}!</h1>
    
  4. Alternatively, use this code to process the data and to set a default value if none was provided.
    <%
        java.util.HashMap params = new java.util.HashMap();
        String name = "World";
        if (controllerResponse != null) {
           params = (java.util.HashMap)controllerResponse.getData();
           if (params != null) {
              name = (String) params.get("name");
              name += ", my friend";
           }
        }
    %>
    
  5. And then change the output line to use that value:
    <h1 align="center">Hello <%=name %>!</h1>
                            ^^^^^^^^^^^^
    

HelloWorld.jsp should now look like this:

<%@ taglib uri="/c" prefix="c" %>
<h1 align="center">Hello ${param.name}!</h1>

or this:

<%
    java.util.HashMap params = new java.util.HashMap();
    String name = "World";
    if (controllerResponse != null) {
       params = (java.util.HashMap)controllerResponse.getData();
       if (params != null){
          name = (String) params.get("name");
          name += ", my friend";
       }
    }
%>
<h1 align="center">Hello <%=name %>!</h1>

Try It Out

  1. Visit https://{{domain}}/networking/pages/Hello.jsp.
    (For {yourDomain}, substitute the URL you use to access the platform.)
  2. Type in a name and click the button to see the results.
  3. In the platform, click GearIcon.png > GearIcon.png > Customization > Developer Resources > Debug Log to view the entry you made in the log.
    If that window is already open, refresh it by clicking the "circling arrows" icon in the upper right: RefreshIcon.png.
You should see an entry like this:
DebugMessage.jpg

Learn More


Next
HowTo:Classes, APIs, and Naming Conventions