Skip to main content

Notice: this Wiki will be going read only early in 2024 and edits will no longer be possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.

Jump to: navigation, search

Difference between revisions of "Scout/Tutorial/3.7/Minicrm Step-by-Step"

< Scout‎ | Tutorial‎ | 3.7
m (Create New Scout Project)
(32 intermediate revisions by 8 users not shown)
Line 1: Line 1:
{{ScoutPage|cat=Tutorial}}
+
{{ScoutPage|cat=Tutorial 3.7}}
 +
'''Mini CRM Tutorial'''
  
This little tutorial will show you how to create your first little application.
+
With this tutorial, you'll create a little example application with {{ScoutLink|SDK|name=Scout SDK}}, where you can enter and edit companies.
It uses a very small sample database provided for download.
+
The data is selected from the database and shown on the client, allowing users
+
to browse it, search it and edit it.
+
  
== Installation / Set Up ==
+
== Requirements ==
 +
This tutorial assumes that you have installed Scout SDK as described in {{ScoutLink|HowTo|Install Scout SDK|Download and Install Scout SDK}}. Click [[{{BASEPAGENAME}}/Project From Existing Workspace|here]] to download the workspace.
  
You need to get the '''Scout SDK''' and a '''demo database''' to work through this tutorial. {{ScoutLink|Tutorial|Installation and Setup‎|Learn more}}
+
== Create New Scout Project ==
 +
Creating new scout projects is described
 +
[[{{BASEPAGENAME}}/Minicrm/New_Eclipse_Scout_Project|here]]. That page also shows how to launch the server and the client.
  
== Setup a New Eclipse Scout Project ==
+
== Get example Database ==
 +
Follow the instructions on [[{{BASEPAGENAME}}/Minicrm/Get_example_database|this page]] to get our small Apache Derby example database.
  
Switch to the Scout Perspective and '''create a new Scout Project'''. {{ScoutLink|Tutorial|Setup a New Eclipse Scout Project|Learn More}}
+
== Set up SQL Service ==
 +
Now we need to tell the application how to contact the database. How this works is described  [[{{BASEPAGENAME}}/Minicrm/Set_up_SQL_Service|here]].
  
== Setup a SQL Service ==
+
== Write the first Page ==
 
+
A standard Eclipse Scout application consists of pages in a tree structure. A page typically shows data in some sort of table. If you write an application, you need to start with a page. [[{{BASEPAGENAME}}/Minicrm/Write_the_first_page|Learn more]]
We'll use [http://db.apache.org/derby/ Apache Derby] for this tutorial. We need to tell the framework how to contact it. {{ScoutLink|Tutorial|Setup a SQL Service|Learn More}}
+
 
+
== Write The First Page ==  
+
 
+
A standard Eclipse Scout application consists of '''pages''' in a tree structure. A page typically shows data in some sort of table. If you write an application, you need to start with a page. {{ScoutLink|Tutorial|Write The First Page|Learn more}}
+
  
 
You should have a tiny Eclipse Scout application running at the end of this step!
 
You should have a tiny Eclipse Scout application running at the end of this step!
Line 32: Line 30:
 
Very simple indeed!
 
Very simple indeed!
  
== Add a search form to the table page ==  
+
== Add a search form ==
 
+
We created a page with a table listing all the companies in the database. Add a search form that allows users to limit the number of rows returned.
We created a page with a table listing all the companies in the database. Add a search form that allows users to limit the number of rows returned. {{ScoutLink|Tutorial|Add a search form|Learn more}}
+
[[{{BASEPAGENAME}}/Minicrm/Add_a_search_form|Learn more]]
  
 
== Add a form to edit the data ==
 
== Add a form to edit the data ==
 
+
In order to edit the data in our page, we need to create a context menu to call a form, create the form and the process service it needs to actually select, insert, update (and possibly delete) the data. [[{{BASEPAGENAME}}/Minicrm/Add_a_form_to_edit_the_data|Learn more]]
In order to edit the data in our page, we need to create a context menu to call a form, create the form and the process service it needs to actually select, insert, update (and possibly delete) the data. {{ScoutLink|Tutorial|Add a form|Learn more}}
+
 
+
All the examples in the tutorial were based on the company table. You should be able to do the same for the person table, now.
+
  
 
== Write the second page ==
 
== Write the second page ==
  
We wrote the company table page, now let's write a top-level person table page. Once we have that, we want to '''reuse the table page''' by also using it as a child page for a company. {{ScoutLink|Tutorial|Write The Second Page|Learn more}}
+
We wrote the company table page, now let's write a top-level person table page. Once we have that, we want to '''reuse the table page''' by also using it as a child page for a company. [[{{BASEPAGENAME}}/Minicrm/Write_the_second_page|Learn more]]
  
 
You will end up with the following tree structure for your application:
 
You will end up with the following tree structure for your application:
Line 56: Line 51:
 
   └─Person Table Page
 
   └─Person Table Page
  
== Reorganize the tree and add a webservice ==
+
== Reorganize the tree ==
  
We want to add a web service (in this case we're going to use Bing because it offers a standard interface where as Google no longer does). We'll add it under the ''companies table page'', which will require us to add a '''page with nodes''' and reorganize the tree a bit. {{ScoutLink|Tutorial|Reorganize the tree|Learn more}}
+
We want to add an additional nodes under the ''companies table page''. This will require us to add a '''page with nodes''' and [[{{BASEPAGENAME}}/Minicrm/Reorganize_the_tree|reorganize the tree a bit]].
  
 
When we're done, the result should look as follows:
 
When we're done, the result should look as follows:
Line 72: Line 67:
 
   └─Person Table Page
 
   └─Person Table Page
  
== Use a webservice ==
+
== Code Types ==  
 +
Each Code Types provides a list of values in order to fill up elements like Smart Fields or List Boxes.
  
We want to add a web service (in this case we're going to use Bing because it offers a standard interface where as Google no longer does). We'll add it under the ''companies details node page''. {{ScoutLink|Tutorial|Use a webservice|Learn more}}
+
In a next step we want to divide the companies into two groups: suppliers and customers. When the company is type of customer, a Smart Field with ratings between A and D should appear. Let's create two Code Types and add some behaviour to the CompanyForm and ProcessServices. [[{{BASEPAGENAME}}/Minicrm/Code_Types|Learn more]]
  
When we're done, the result should look as follows:
+
== Lookup Calls and Lookup Services ==  
 
+
Standard Outline
+
  │
+
  ├─Company Table Page
+
  │  │
+
  │  └─Company Details Node Page
+
  │    │
+
  │    ├─Person Table Page
+
  │    │
+
  │    └─Bing Table Page ← <font style="background-color: yellow">new</font>
+
  │
+
  └─Person Table Page
+
 
+
== Code Types ==
+
Each Code Types provides a list of values in order to fill up elements like Smart Fields or List Boxes.
+
  
In a next step we want to divide the companies into two groups: suppliers and customers. When the company is type of customer, a rating between A and D has to be assigned to them. Let's create two Code Types and add different behaviour to the CompanyForm and ProcessServices. {{ScoutLink|Tutorial|Code Types|Learn more}}
+
In the previous chapter we have seen how to fill smartfields with an enumerated list of codes that were based on a code type. However, sometimes you need a smartfield (or listbox) with dynamically calculated entries that are based on the data in your database (e.g. a smartfield that allows selecting a person or company). This chapter shows how to accomplish this by implementing a so called Lookup Call and a corresponding Lookup Service. [[{{BASEPAGENAME}}/Minicrm/Lookup_Calls_and_Lookup_Services|Learn more]]

Revision as of 05:31, 13 April 2012

The Scout documentation has been moved to https://eclipsescout.github.io/. Mini CRM Tutorial

With this tutorial, you'll create a little example application with The Scout documentation has been moved to https://eclipsescout.github.io/., where you can enter and edit companies.

Requirements

This tutorial assumes that you have installed Scout SDK as described in The Scout documentation has been moved to https://eclipsescout.github.io/.. Click here to download the workspace.

Create New Scout Project

Creating new scout projects is described here. That page also shows how to launch the server and the client.

Get example Database

Follow the instructions on this page to get our small Apache Derby example database.

Set up SQL Service

Now we need to tell the application how to contact the database. How this works is described here.

Write the first Page

A standard Eclipse Scout application consists of pages in a tree structure. A page typically shows data in some sort of table. If you write an application, you need to start with a page. Learn more

You should have a tiny Eclipse Scout application running at the end of this step!

You will end up with the following tree structure for your application:

Standard Outline
 │
 └─Company Table Page

Very simple indeed!

Add a search form

We created a page with a table listing all the companies in the database. Add a search form that allows users to limit the number of rows returned. Learn more

Add a form to edit the data

In order to edit the data in our page, we need to create a context menu to call a form, create the form and the process service it needs to actually select, insert, update (and possibly delete) the data. Learn more

Write the second page

We wrote the company table page, now let's write a top-level person table page. Once we have that, we want to reuse the table page by also using it as a child page for a company. Learn more

You will end up with the following tree structure for your application:

Standard Outline
 │
 ├─Company Table Page
 │  │
 │  └─Person Table Page
 │
 └─Person Table Page

Reorganize the tree

We want to add an additional nodes under the companies table page. This will require us to add a page with nodes and reorganize the tree a bit.

When we're done, the result should look as follows:

Standard Outline
 │
 ├─Company Table Page
 │  │
 │  └─Company Details Node Page ← new
 │     │
 │     └─Person Table Page
 │
 └─Person Table Page

Code Types

Each Code Types provides a list of values in order to fill up elements like Smart Fields or List Boxes.

In a next step we want to divide the companies into two groups: suppliers and customers. When the company is type of customer, a Smart Field with ratings between A and D should appear. Let's create two Code Types and add some behaviour to the CompanyForm and ProcessServices. Learn more

Lookup Calls and Lookup Services

In the previous chapter we have seen how to fill smartfields with an enumerated list of codes that were based on a code type. However, sometimes you need a smartfield (or listbox) with dynamically calculated entries that are based on the data in your database (e.g. a smartfield that allows selecting a person or company). This chapter shows how to accomplish this by implementing a so called Lookup Call and a corresponding Lookup Service. Learn more

Back to the top