Spanish version
How to include PageCount information in Work With Pattern
The main goal of this document is to explain how you can modify an existing pattern (adding or changing a specific functionality) to adapt it to your client's needs. In this sample, we will show
you the way to add a textblock below the work with grid in order to display the PageCount information. As a result, the final user will see how many pages of information he can go thru.
After reading the documentation about patterns, you will realize that this kind of visual changes can be accomplished by modifying the relevant .dkt file.
What do we need to implement this new functionality ?
1) A textblock to display the legend "Page m of n"
2) Assign the relevant value to m and n
Getting started...
The first time Work With Pattern is applied you get the following grid.
Note: I have changed the Page domain to display 5 records per page (Default is 10).
The techy part...
Let's see how we can add a textblock below the grid modifying the GridTemplate.dkt file.
While taking a look at the dkt file, you will notice that in line 238 there is something like this:
<%= HtmlToKmw.TextBlock("TitleText", General.NodeDescription(node), GlobalWorkWithConfig.Config.Theme("Subtitle")) %>
Looks like a TextBlock is being added. But what are those parameters for ? Remember that patterns has a Help file named Documentation.chm located in C:\<Program Files>\ARTech\Patterns11\Tools.
If you open that file and search TextBlock, the relevant information of Textblock method is shown.
Now we know that those parameters are: name, value and themeClass to be assigned to the textblock.
Furthermore, the previous 2 lines looks familiar:
<%= HtmlToKmw.OpenTag("TR") %>
<%= HtmlToKmw.OpenTag("TD") %>
adds a line and then a cell !!!
In addition, the next 2 lines close those tags:
<%= HtmlToKmw.CloseTag("TR") %>
<%= HtmlToKmw.CloseTag("TD") %>
That will help us to add our own textblock !!! Now that we know how to add a textblock let's see where the grid is being added, so we can then add a new row just below it and include our new textblock there.
Take a look at line 350...
<%= HtmlToKmw.OpenTag("TR") %> // a new line
<%= HtmlToKmw.BeginTableCell("", 2) %> // a new cell
What are those parameters for ? Let's see the Doumentation of it...
Great, know we know that we can set the align property and also the colspan of the new cell :)
Now take a look at line 352...
<%= HtmlToKmw.BeginGrid(...) // the grid is being added !
// relevant code to add the grid's information
Again, lets see line 391
<%= HtmlToKmw.EndGrid() %> //ends the grid
<%= HtmlToKmw.CloseTag("TD") %> // close the cell
<%= HtmlToKmw.CloseTag("TR") %> // close the row
Looks that we can add a new row here and it will be displayed just below the grid, that's what we need.
So, let's try adding a new table line for our textblock. To do that we need to add the following lines to GridTemplate.dkt file.
<%= HtmlToKmw.OpenTag("TR") %> // new line
<%= HtmlToKmw.BeginTableCell("center", 2) %> // I want the information to be centered in the cell and colspan = 2, the same that the grid uses
<%= HtmlToKmw.TextBlock("PageCountInformation", "PageCountInformation" , GlobalWorkWithConfig.Config.Theme("Subtitle")) %> // OUR NEW TEXTBLOCK
<%= HtmlToKmw.CloseTag("TD") %>
<%= HtmlToKmw.CloseTag("TR") %>
Great! Our textblock looks perfect! But it does not have the information yet :) Since that information can be obtained at execution time, we need to add the relevant code in an Event or
a sub routine. In other words, we need to find and event or a sub routine to add something like this: TextBlock.Caption = "Page " + &CurrentPage + " of " + str(gridName.PageCount)
Notes:
a) &CurrentPage is already defined in the dkt, since it is used for paging purposes.
// Variables for paging.
...
vars.AddCommon("CurrentPage", "Current Page", DataType.Numeric, 4, 0); // now you also know how to add a variable !!!
b) we only need to know how to refer to the relevant grid in order to be able to use its PageCount method
For this, let's take a look at the events of the generated WW web panel. As you can see, there is a Start Event, Refresh Event and sub routines to manage the different functionalities of the web panel and its components. As you can see, the Resfresh Event calls the 'FixCurrentPage' sub routine, that routine deals with the &CurrentPage and also uses Grid1.PageCount so it seems to be a good place to add our assignment.
We are almost done, let's go back to our GridTemplate.dkt file and find the sub routine 'FixCurrentPage' so we can add our code at the end of it.
It starts at line 611...
Sub 'FixCurrentPage'
If <%= gridName %>.PageCount = 0
&CurrentPage = 0
Else
If &CurrentPage > <%= gridName %>.PageCount
&CurrentPage = <%= gridName %>.PageCount
Else
If &CurrentPage < 1
&CurrentPage = 1
EndIf
EndIf
EndIf
PageCountInformation.Caption = "Page " + &CurrentPage.ToString() + " of " + str(<%= gridName %>.PageCount) // our information assignment
EndSub
Let's re-generate the pattern to see if it works....
That's it. Now we have Page 1 of 3 displayed at the bottom of the grid !!!
Cosmetics : Let's add our textblock inside a new table, so we can assign a theme class to it and get a better look and feel.
<%-- PageCount Information --%>
<%= HtmlToKmw.OpenTag("TR") %>
<%= HtmlToKmw.BeginTableCell("", 2) %>
<%= HtmlToKmw.BeginTable("TablePageCount", "TableBottom", 0, 0, "none", 0) %>
<%= HtmlToKmw.OpenTag("TR") %>
<%= HtmlToKmw.BeginTableCell("center", 2) %>
<%= HtmlToKmw.TextBlock("PageCountInformation", "PageCountInformation" , GlobalWorkWithConfig.Config.Theme("Subtitle")) %>
<%= HtmlToKmw.CloseTag("TD") %>
<%= HtmlToKmw.CloseTag("TR") %>
<%= HtmlToKmw.EndTable() %>
<%= HtmlToKmw.CloseTag("TD") %>
<%= HtmlToKmw.CloseTag("TR") %>
Click here to download the modified GridTemplate.dkt file