Example of 2 synchronized master-detail CRUD datagrids on a single page?

1,200 views
Skip to first unread message

Stefan Scott

unread,
Jan 25, 2015, 12:31:56 PM1/25/15
to manydesign...@googlegroups.com
Hello -

After many years of researching web application frameworks for doing CRUD apps - including frameworks based on NodeJS, Golang, Python, Java, Scala, Clojure, Erlang, Haskell, and SML/NJ (while avoiding PHP :-) - I finally discovered Portofino today (by trying a different Google search: "master detail CRUD") and I am very impressed with its features, stability and ease-of-use.

Within an hour of downloading Portofino, I was able to unzip it, launch TomCat, import an existing database, and do some setup - and have a working web app with all the basic features (navigation / menus, persistence / CRUD, authentication / authorization).  This is the first time I have been able to get a web app up and running so fast!


One additional feature which is nice to have an a (web) database is a "master-detail" form: specifically, which includes two datagrids on the same form (eg, a parent table "Customers" and a child table "Invoices"), where the user can click on an individual row in the parent (Customers) table, to display a set of row in the child (Invoices) table.

Here is an example of a JavaScript framework (ShieldUI, closed-source I believe), which does this:


Each time you click on a row in the upper (parent) datagrid - it instantly displays a different set of rows in the lower (child) grid.

Questions:

1. Is this possible to do using Portofino?

I am looking at the page http://portofino.manydesigns.com/en/features/crud which shows an example of a master-detail form - but the parent form displays a single record.

So what I am asking is: is it possible for the master firm to display multiple records (in a list, or "datagrid") - allowing the user to click on a record in the parent datagrid (or in the worst case: select a checkbox) in order to display the associated records in the child datagrid?

2. Can this be accomplished simply by doing basic configuration - or would it be necessary to do customization also?

3. Are there any examples / tutorials providing more detailed information / instructions on how to do this?

4. Would it be possible, in the future (after I learn more about Groovy :-) for me to define a wizard to generate this type of page containing a master-detail pair of datagrids?

I have frequently used such a "form wizard" in Microsoft Access for example:

I would like to express my thanks to the developer of the Portofino project.

It does not seem to be very well-known yet (perhaps because the only Wikipedia page is in Italian?) but it is a very complete system providing an excellent web application development tool.

(And the fact that the development tool is browser-based is yet another "plus").

- Stefan Scott



Alessio Stalla

unread,
Jan 26, 2015, 6:20:54 AM1/26/15
to manydesign...@googlegroups.com
On Sun, Jan 25, 2015 at 6:31 PM, Stefan Scott <stefansc...@gmail.com> wrote:
Hello -

After many years of researching web application frameworks for doing CRUD apps - including frameworks based on NodeJS, Golang, Python, Java, Scala, Clojure, Erlang, Haskell, and SML/NJ (while avoiding PHP :-) - I finally discovered Portofino today (by trying a different Google search: "master detail CRUD") and I am very impressed with its features, stability and ease-of-use.

Within an hour of downloading Portofino, I was able to unzip it, launch TomCat, import an existing database, and do some setup - and have a working web app with all the basic features (navigation / menus, persistence / CRUD, authentication / authorization).  This is the first time I have been able to get a web app up and running so fast!

We're happy to hear that! Let's hope it's the beginning of a new success story :)
Let me answer those questions of yours in bulk below.
 
One additional feature which is nice to have an a (web) database is a "master-detail" form: specifically, which includes two datagrids on the same form (eg, a parent table "Customers" and a child table "Invoices"), where the user can click on an individual row in the parent (Customers) table, to display a set of row in the child (Invoices) table.

Here is an example of a JavaScript framework (ShieldUI, closed-source I believe), which does this:


Each time you click on a row in the upper (parent) datagrid - it instantly displays a different set of rows in the lower (child) grid.

Questions:

1. Is this possible to do using Portofino?

I am looking at the page http://portofino.manydesigns.com/en/features/crud which shows an example of a master-detail form - but the parent form displays a single record.

So what I am asking is: is it possible for the master firm to display multiple records (in a list, or "datagrid") - allowing the user to click on a record in the parent datagrid (or in the worst case: select a checkbox) in order to display the associated records in the child datagrid?

2. Can this be accomplished simply by doing basic configuration - or would it be necessary to do customization also?

3. Are there any examples / tutorials providing more detailed information / instructions on how to do this?

4. Would it be possible, in the future (after I learn more about Groovy :-) for me to define a wizard to generate this type of page containing a master-detail pair of datagrids?

I have frequently used such a "form wizard" in Microsoft Access for example:


To a certain extent, everything is possible ;) Portofino is quite flexible. What you're asking, though, is: how hard is it to achieve that?
Well, it depends on how strict your requirements are. It can be a matter of simple configuration, or it might require some coding.

If you look at CRUD pages as generated by the wizard for related tables by considering foreign keys, you should be able to see the use of the parent's crud variable to parametrize the child's query.
If you read about embedding pages and experiment with it a little, you now have the elements to combine to achieve something that resembles what you asked. See: http://portofino.manydesigns.com/en/docs/reference/working-with-pages/managing-page-children/#embedded-child-pages
You can simply embed the child crud in the parent's detail. You won't see both tables at once, you'll see a single parent record along its related children records.

If you want to show both tables on a single page without ever going to a single record, then you need coding. There are no instructions on this specific development, but you can find information in this group, in the reference manual (http://portofino.manydesigns.com/en/docs/reference) and also in some blog articles (http://portofino.manydesigns.com/en/blog). You'll have to know or learn:
- how to add actions to existing Groovy pages (Groovy + Stripes)
- how to output the HTML you want (JSP + Elements)
- possibly, how to link the two tables via JavaScript so that clicking on a row does not reload the entire page.

Depending on your background, that can range from dead simple to daunting. A developer accustomed to Java web applications shouldn't have any difficulty. A lot of stuff is a matter of copying and tweaking examples that you can find in Portofino itself (the framework's source, or the demo-tt application for some stuff).

As for the wizard, do you mean something like the crud's Configuration page, only in wizard form? That is certainly doable with a little Groovy and JSP. The configuration page isn't really anything magic, it's just another page.

If you're going to use Portofino in a commercial project, I should add that we routinely develop customizations like that for our customers. Generally it is cheaper like that than doing it in-house since, well, that's our job and we're quite good at it ;)

I would like to express my thanks to the developer of the Portofino project.

It does not seem to be very well-known yet (perhaps because the only Wikipedia page is in Italian?) but it is a very complete system providing an excellent web application development tool.

(And the fact that the development tool is browser-based is yet another "plus").

Thanks for the kind words! We used to have an English Wikipedia page, but it was removed because the maintainer of that section of Wikipedia thought it had not enough references to independent sources. We tried to defend our position but couldn't avoid its removal, sadly.
We'd love Portofino to become more widely known. You can start by spreading the word if you like it! ;)

Stefan Scott

unread,
Jan 27, 2015, 11:37:19 AM1/27/15
to manydesign...@googlegroups.com
Hi Alessio -

Thank you for these helpful answers.

I will now study some documentation about the Stripes Framework, as I believe this will be helpful to learn how to customize Portofino to my specific needs.

I already am thinking of a few additional customizations I will need to make:

- add a "total" field under a column in a table

- create a custom "wizard" (sequence of screens) to guide the user through filling in a sequence of forms (for a record having many columns)

Maybe I could adapt the "admin" wizard for this - but I suspect that the admin wizard is not saving anything in a Postgres table (I looked in PgAdmin III - I did not see a new table there). This probably means that any "custom wizard" which I create might be slightly different from the admin wizard (because I will want to persist the results of the wizard to a table in my Postgresql database).

- Stefan Scott

Alessio Stalla

unread,
Jan 27, 2015, 12:09:16 PM1/27/15
to manydesign...@googlegroups.com
On Tue, Jan 27, 2015 at 5:37 PM, Stefan Scott <stefansc...@gmail.com> wrote:
Hi Alessio -

Thank you for these helpful answers.

Hi, you're welcome!
 
I will now study some documentation about the Stripes Framework, as I believe this will be helpful to learn how to customize Portofino to my specific needs.

Yes, that surely helps :)
Of Stripes we use actions, handlers and resolutions, and, in the view side, templating. We don't use its forms and validation, nor any persistence plugin.
 
I already am thinking of a few additional customizations I will need to make:

- add a "total" field under a column in a table

- create a custom "wizard" (sequence of screens) to guide the user through filling in a sequence of forms (for a record having many columns)

Maybe I could adapt the "admin" wizard for this - but I suspect that the admin wizard is not saving anything in a Postgres table (I looked in PgAdmin III - I did not see a new table there). This probably means that any "custom wizard" which I create might be slightly different from the admin wizard (because I will want to persist the results of the wizard to a table in my Postgresql database).

The admin wizard is a complex Java action which does a number of things that are not common in typical Groovy pages, such as using the HTTP session and altering Portofino's metadata (the model). You might steal from it the UI template that shows the sequence of steps; however, if you want to show a few forms, you'd better start from something simpler (such as the Form Page).

Reply all
Reply to author
Forward
0 new messages