Mail/Login: Password : forgot my password!

Uniface frontend templating part 3 - The Uniface Entity Lister

Direct link
Written by -GHAN- // Tags: lfileload template uniface load template_dir dict

It's been quiete a while but as the summer ends and the days turn darker earlier, I found some time hacking on this series.

First of all let me introduce you to a new entry for the USP:

String = en_template_load(rc,"template-name",quoted "T/F")

This little code has great things in store for those who want to load external files and not really like to waste to much time on considerations. Simply point out what to load and get it delivered.
As you might remember, we want to deploy the html template files externally. I found it to be fitting to define a directory in the defines :
Uniface Defines Trigger SOURCE CODE
Sorry- ... please log-in or register to get this!

<TEMPLATE_DIR> will be used in this new entry and in en_prepare_master_template, which loads the master container file.

But back to the new entry. Take a look at it. This might be confusing but mainly it shows how to load a file and return it (in a safe way).
Uniface entry SOURCE CODE
Sorry- ... please log-in or register to get this!

Sure, we could make this shorter and simply take the lfileload statement but I wanted to be sure on, what happens and not spend hours in the debugger, if something fails ... ;) Please add this entry to your server page.
As this is part 3 of the series, we will modify our previous code a bit. All entries will be necessary to get this serverpage up and running. Go get the code together from part 1 and part 2. They are mandatory!
I've updated the entries in part 2 ... please take a look at the en_prepare_master_template and update your source.

To demonstrate how effective this really is, we will start off with an entity lister. The user will enter an entity name and the server page will list all fields of that entity according to the Uniface Dict (which here claims to be v9.1).

1. Defining the HTML outputs

The entity lister contains two additional (HTML) files called overview_head.htm and overview_row.htm
File Overview_head.htm SOURCE CODE
Sorry- ... please log-in or register to get this!

The head has a form, a table and some CSS definitions to shape the stuff a bit.
File overview_row.htm SOURCE CODE
Sorry- ... please log-in or register to get this!

The plan is to put every line of data into the shape of overview_row.htm and assemble it into overview_head.htm (in the plate !DATA!).

Everytime the user hits ENTER or pushes the button, Uniface will try to get the data for the entered Entity.

2. Uniface: Adding UCFIELD.UDICT to the serverpage

We need that entity to list the fields. So we're gonna "paint" it in the source. Switch over to the paint tablaeu and add the following line:
Uniface paint tableau source SOURCE CODE
Sorry- ... please log-in or register to get this!

After having done this, refresh the component editor by pressing the button below. The enity should now appear in the left field called structure. DoubleClick the entity and change the property Field List to All Fields (oh, I hate doing this in that way. But well, Uniface V9.3 doesn't have all the features of Uniface V9.4, right?) Finally change the read trigger to
Uniface Read Trigger SOURCE CODE
Sorry- ... please log-in or register to get this!

and that's it.

3. Uniface: The Exec() Trigger

Well ... we will put the main code here this time. I've prepared a code for you guys out there which is checked, compiled and tested here. A Simple copy'n paste should do, but I advise you to inspect the code very well. You'll need to understand what happens in there and not just end up as a user pressing keys, right? :) Here you go ...
Uniface Exec Trigger SOURCE CODE
Sorry- ... please log-in or register to get this!

Let me explain the stuff for you.

1) Init

I define a page title and initialize some values. After that, the templates are loaded so we can work with them and build the layout (1.2). In 1.3 the possible parameter from the web is taken into a local var called vpara_entity.

2) looking for the data of the entity

Depending upon if vpara_entity is filled, we either put a message into the message area (USP_MESSAGE) saying "you didnt enter a entity name!" or we try to read the entity.

In the while loop, every occurence is transferred into HTML according to the layout in the file overview_row.htm. Every row changes the color as we mark every 2nd occurence to have the CSS class "rowcolor". The concatenated result is stored in vcontent.

3) Connecting the rows with the head

The rows are a part of the head. So we need to connect them. In the file overview_head.htm there is a plate called DATA. What we do is simply to $replace the DATA by the rows in vcontent. This job is done by en_template_render() and delivers the result in vtemplate.

4) Filling out the master container layout

By now, we have made the content of the page. But what we are missing is to place the content in our master container, the file which holds the main layout for our page. While doing so, we further define plates for the content (USP_CONTENT), the title (TITLE) and the search value (ENTITY). If there is no message in the message area (USP_MESSAGE) by now, we fill in the text "This is the overview page.".

And if we didnt find data in the entity, we change the message into "Sorry, the entity couldnt be found!".

5) + 6) rendering the master container layout

Finally we tell en_template_render() to work for us and put the result into vhtml which then is transferred into $webinfo("output") and we're done.

4. Hit'n Run

After having included this into the serverpage, you should compile it. Afterwards Launch your urouter and start the server page. The Screeshot below shows you, what you will get. Tell me how you liked it or handle the errors to me, so i can correct it here! Enhancements are also welcome.

Please note, that this example is a part of a growing server page to demonstrate, how Uniface can be used to work with web very effectivly. I don't claim it to be the most smart design- I can do better ;) But the intension is not to blind you by fancy gfx! It's to show you, how it can be done.

Screenshot: The Uniface Entity Lister
Screenshot: The Uniface Entity Lister

- Uniface frontend templating part 1 - beyond skeletons and paint tableau
- Uniface frontend templating part 2 - preparing the USP
- Making the tab widget eyecandy!
- Output channels and triggers of server pages
- Handling Inputs from the web


on 2014-09-25 12:01:55 Matthias wrote:

Thats what Ive been looking for thanks! SMARTY for Uniface :-) Do you also combine this with the existing stuff for painting entities in DSPs or do you create own forms etc.?

on 2011-03-22 09:38:01 -GHAN- wrote:

hehe, I went over doing so as screwed my sources to often while swithing from C , Perl, JavaScript and over to Uniface *doh* ... Lately one of my fellers here asked : ... erhmm is this really necessary?. I tok two seconds thinking it over and replied: Dude, if you would trip like I do, then this is your way to survive all this!

on 2011-03-22 09:32:45 RichardGill wrote:

Its cool to use the real equality operator (==) instead of the assignment one (=), even if the latest is still usable :)

1082 view(s) / 2010-07-11 18:17:20 / LAST UPDATED: 2011-07-13 16:11:08