SEEWARNING Before creating your site, it is recommended to read the following documentation:Before starting.


The block token reads and displays the Entity which is assigned to it by setup:

1. It reads the entity or entities in the X3 database by calling up an interface (Web service) of type 'Access to data',

2. It performs an iteration on the entities returned to dynamically create the lines of a grid.

Getting started

Principle

The block token is inserted in the HTML page with the following syntax:

<table>
<!adx="MyBlock">
    <tr>
        <td adx="aBLKELMTRANK"></td>
        <td adx="ITEMREF"></td>
    </tr>
<!adx="MyBlock">
</table>

The XTEND engine processes blocks as follows:

Parsing phase of the HTML page.

This stage is performed once when the HTML page is loaded:

  • Creation of the block object and addition to the structure,
  • Calculation of dependencies between blocks if the selection of a block depends on another block.
    The result of this calculation provides the initialization order of the blocks
Generation phase of the HTML page.

This stage is carried out each time the HTML page is displayed:

1. Block initialization

  • Calculation of selection criteria according to the selection type,
  • Calling up of the Web service 'Access to data' with the selection criteria as a parameters,
  • Creation and storage in the memory of the returned entities.

2. Iteration on all returned entities

  • Inserting of the entity in the data context,
  • Calling up of the HTML generation method for sub-tokens,
  • Deletion of the entity in the data context,

In previous example, if the selection displays 3 products of code PUZ001, PUZ002 and PUZ003, a 3-line grid will be obtained:

1

PUZ001

2

PUZ002

3

PUZ003

 The generated HTML is as follows:

The HTML 'child' of the block token was repeated 3 times and was recalculated each time with respect to the new data context (current line).

<table>
    <tr>
        <td>1</td>
        <td>PUZ001</td>
    </tr>
    <tr>
        <td>2</td>
        <td>PUZ002</td>
    </tr>
    <tr>
        <td>3</td>
        <td>PUZ003</td>
    </tr>
</table>

Selection and sort

The block token not only displays data grids, it also manages the dynamic modification of selection and sort criteria.

The block setups set the default criteria and it is possible to authorize or deny the modification of these criteria by a dynamic link.

The dynamic link token can modify the block criteria and it is also possible to define selection and sort setups for this token.

Only the selection and sort criteria or the page main block (alias AMAIN) can be modified by the dynamic link criteria.

It is possible to define several blocks by page, but only one of them (the main block) has selection and sort criteria that can be modified by the user.

There are three types of modification via dynamic link for the block criteria:

  • The criteria of dynamic link 'Replaces main block selection':
    • Block selection = link selection criteria

  • The criteria of dynamic link 'Added to main block selection':
      • Refines the block request with the link criteria,
      • Block selection = block selection criteria + link selection criteria

  • The criteria of dynamic link 'Added up to current main block selection':
      • Refines the block request by adding the dynamic link selection (AND logic) to the current block request,
      • This option is used if the block selection results from the aggregation of several dynamic links,
      • Block selection = block selection criteria + sum of the criteria of all clicked links.

These three options make it possible to handle most situations occurring in Web pages.

The block token record is used to set up the block selection and sort criteria.

These are the default criteria applied at first display of the page containing the block.

The block token proposes two parameters 'Modifiable selection' and 'Modif. sorting' indicating if the selection criteria and/or sort criteria can be modified by a dynamic link.

These parameters are only applied if the block was defined as main block in the record of the Web page displaying it.

Block containing several cells by line

In order to display a block with several cells by line, the specific token ASTAMP is used to delineate the cell.

The XTEND server repeats the HTML code present between the two ASTAMP tags as many times as cells in the line.

<table>
<!-Iteration on the block lines-->
<!adx="MYBLOCK">
    <tr>
        <!-Code repeated as many times as cells by lines'-->
        <!adx="ASTAMP">
                <!--Used to alternate the color of cells-->                                                       
                <td adx="ALINESTYLE:xattr=Class">
                   <!--Code HTML d'une cellule-->
                   <b>Name</b><p adx="NAME"></p>
                   <b>First name</b><p adx="FIRSTNAME"></p>
                </td>
        <!adx="ASTAMP">
    </tr>
<!adx="MYBLOCK">
</table>

How to fill the empty cells

The example below shows how to fill empty cells when the number of recordings is not a multiple of the number of cells by line.

The conditioned blockADISPSTAMPEMPTY is used to define the HTML dedicated to the empty cells.

<table>
<!-Iteration on the block lines-->
<!adx="MYBLOCK">
    <tr>
        <!adx="ASTAMP">                        
                <td adx="ALINESTYLE:xattr=Class">
                    <!adx="ADISPSTAMPEMPTY">
                        <!--Empty cell with a blank-->      
                        &nbsp;
                    <!adx="ADISPSTAMPEMPTY">
                    <!adx="ADISPSTAMPEMPTY:xnot">
                        <!--Code HTML d'une cellule-->
                        <b>Name</b><p adx="NAME"></p>
                        <b>First name</b><p adx="FIRSTNAME"></p>   
                    <!adx="ADISPSTAMPEMPTY">
                </td>
        <!adx="ASTAMP">
    </tr>
<!adx="MYBLOCK">
</table>

Actions impacting the blocks

Page numbering

The actions ABLKFIRSTPAGE, ABLKNEXTPAGE, ABLKPREVPAGE, ABLKLASTPAGE are used to manage the page numbering in the blocks.

The tokens ADLKFIRSTPAGE, ADLKNEXTPAGE, ADLKPREVPAGE, ADLKLASTPAGE can be used on the page main block.

The fields aBLKNBELMTS and APAGEPOS display the total number of recordings and the position of the page compared to the total page number.

The conditioned blocks AHIDEMAINFIRSTPAGE and AHIDEMAINLASTPAGE manage the display/hide status of page numbering buttons for the first and last pages.

Syntax

MonBloc.ADLK*

For instance:

Page numbering with display management at start and end of page numbering.

<table width="100%">
    <tr>
        <td align="left" width="20%">
        <!--Hide FirstPage and Previous actions if current page is the first page-->           
            <!adx="aHideMainFirstPage">
                ----
                <a href="" adx="AMAIN.aDlkFirstPage">First</a>
                <a href="" adx="AMAIN.aDlkPrevPage">Previous</a>
            <!adx="aHideMainFirstPage">
        </td>
        <!--Displays page information-->
        <td align="center" width="60%">
            Page: <span adx="AMAIN.aPagePos"></span> -
            Number of elements: <span adx="AMAIN.aBlkNbElmts"></span>
        </td>
        <td align="right" width="20%">                         
        <!--Hide LastPage and Next actions if current page is the last page--> 
            <!adx="aHideMainLastPage">
                <a href="" adx="AMAIN.aDlkNextPage">Next</a>
                <a href="" adx="AMAIN.aDlkLastPage">Last</a>
            <!adx="aHideMainLastPage">
        </td>
    </tr>
</table>

Selection of a line

The dynamic links ADLKSELECT and ADLKUNSELECT (action ABLKSELECT and ABLKUNSELECT) are used to select/deselect a block line.

Use

Insert the tokens ADLKSELECT and ADLKUNSELECT in one of the line cells either in a tag <a> or in a tag <input type='button'>.

The field ABLKSELECTEDLINE contains the rank (1 to N) of the selected line.

For instance:

The block ABLKCOUNTRIES displays the countries in the site ASAMPLE with selection of the line to display the detail Currency/Country language.

A click on the first cell (CRY) selects the line.

<!adx="ABLKCOUNTRIES:xselect=false"> 
    <tr>
        <td><a adx="ADLKSELECT"><span adx="CRY"></span></a></td>
        <td adx="CRYDES"></td>    
        <td adx="CUR"></td>
        <td adx="LAN"></td>                
    </tr> 
<!adx="ABLKCOUNTRIES"> 
<!--Displaying of the line number selected-->
<span adx='ABLKCOUNTRIES.ABLKSELECTEDLINE'></span>

The HTML parameter 'xSelect=true' is used to select the first line by default.

If this parameter is not used, or if its value is 'false', the block has no selected line by default.

When a block has a selected line, it is possible to access the fields of this line via the syntax MyBlock.MyField.

The values of the fields of the selected line can be displayed or used as criteria in a block, dynamic link, or conditioned block.

The conditioned block AHIDEMAINSELECT displays/hides an HTML zone taking into account whether the main block has a selected line or not (see country page of site ASAMPLE).

Return of detail to list

The action ABLKRESTOREMAINCTX is used to get back to a list page from a detail page without loosing the page numbering or the selected line of the main block.

The dynamic link below is used to get back to the page FORMQUERYRES and restore the main block context.

<input type="button" value="Return list" adx="DlkFrmQueryBack" class="xtendButton" >

Direct access to the line data

Following syntax is used to access directly the data of a block line:

<!--First line-->
<span adx="MYBLOCK(first).MYFIELD"></span>]<br>
<!--Last line-->
<span adx="MYBLOCK(last).MYFIELD"></span>]<br>
<!--Nth line-->
<span adx="MYBLOCK(N).MYFIELD"></span>]<br>

Access to the data of a block in JavaScript (JSON)

The following syntax is used to value a JavaScript variable with the JSON representation of a block or block line:

<script>
    // JSON data of a block
    var wMyBlock_JSON=<!adx="MYBLOCK(*)"><!adx="MYBLOCK(*)">;
    var wMyBlock_JSON=<!adx="MYBLOCK(*)"><!adx="MYBLOCK(*):xinclude=FIELD1,FIELD2">;
    var wMyBlock_JSON=<!adx="MYBLOCK(*)"><!adx="MYBLOCK(*):xexclude=FIELD1,FIELD2">;
    // JSON data of a line
    var wMyLine_JSON=<!adx="MYBLOCK(2)"><!adx="MYBLOCK(2)">;
    var wMyLine_JSON=<!adx="MYBLOCK(2):xinclude=FIELD1,FIELD2"><!adx="MYBLOCK(2)">;
    var wMyLine_JSON=<!adx="MYBLOCK(2):xexclude=FIELD1,FIELD2"><!adx="MYBLOCK(2)">;
</script>

The JSON variable of a block is composed of an array of lines:

<script>
    var wMyBlock = [{line 1},{line 2},...];
   
var wMyBlock = [{"STATUT":1,"STATUT_DESCR":"To process","PRIX":81.35,"COD2":"30-112"},
    {"STATUT":2,"STATUT_DESCR":"Processed","PRIX":117.9,"COD2":"31-02"},
    {"STATUT":1,"STATUT_DESCR":"To process","PRIX":606.15,"COD2":"32-034"}];
</script>

The JSON variable of a line is an object containing fields:

<script>
    var wMyLine ={"CHAMP1":"Value1","CHAMP2":"Value2"...};
   
var wMyLine = {"STATUT":1,"STATUT_DESCR":"To process","PRIX":606.15,"COD2":"32-034"}
</script>

For a field, the xjson^parameter generates a JSON object {"FieldName:"Value"}. Without xjson parameter, the JavaScript variable is valued with the field value.

<script>
    // JSON data of a field
    var wMyField_JSON=<!adx="MYFIELD:xjson"><!adx="MYFIELD">;
    //XTEND generates
    var wMyField_JSON={"MYFIELD":"Value"};
   
// Value of a field
    var wMyField_JSON=<!adx="MYFIELD"><!adx="MYFIELD">;
    //XTEND generates
    var wMyField_JSON="Value";
</script>

HTML parameters

Code 

 Parameter 

Effect 

xselect

True/False

Selects the first line by default

Fields of a block

Code 

 Type

Description

ABLKELMTIDX

Integer

Index of an element in a block (O->ABLKNBELMTS-1)

ABLKELMTRANK

Integer

Rank of an element in a block (O->ABLKNBELMTS-1)

ABLKLINEIDX

Integer

Index of line in a block (O->ABLKNBELMTS-1)

ABLKLINERANK

Integer

Rank of line in a block (O->ABLKNBLINES)

ABLKNBELMTS

Integer

Total number of elements (recordings) of a block request

ABLKNBLINES

Integer

Rank of the selected line of a block via action ABLKSELECT

ABLKSELECTEDLINE

Integer

Number of lines in a block

APAGENB

Integer

Number of pages in a block

APAGENUM

Integer

Rank of a block current page

APAGEPOS

Integer

APAGEPOS/APAGENUM

Predefined blocks

Predefined blocks

Code 

Description

ACONST

Contains all fields of type constant

ACURRENT

Current data context (top) in XDEND stack of data

AHTMLFORM

HTML form

AHTTPCOOKIE

HTTP cookies

AMAIN

Main block of a page defined in the page parameters

APBG

Background block of a page defined in the page parameters

AMESS

User messages

AREFERENCE

In the expression MonBlocReference.MonTokenLien, the block MonBlocReference corresponds to 'reference block' ;
The data context of this block is set as a parameter for the action

ASESSION

Contains the user session data

AUSERCRIT

Contains the user criteria (HTML parameter xcrit)

AUSERINF

Contains the user data provided by the login

AUSERVAR

Contains the user variables created by the functions JavaSCript xtdSetUserVar/xtdRemoveUserVar

Prerequisites

SEEREFERTTO Refer to documentation Implementation

Screen management

Header

Tab General

General parameters of the block.

Tab Selection

Parameters of the selection associated with the block.

Tab Sort

Tab Advanced

Reports

By default, the following reports are associated with this function :

  PRTSCR : Screen print

This can be changed using a different setup.

Specific Buttons

Validation,

This button is used to update the XTEND dictionary in XML format.

The X3WEB server takes into account only the dictionary with this format.

There is one XML file per dictionary.

For instance, the ACT.xml file corresponds to all the web actions for the current web site.

Copy

This button is used to copy a block token.

Error messages

The only error messages are the generic ones.

Tables used

SEEREFERTTO Refer to documentation Implementation