Using Javascript with reports - example of usage

[MirzaTinjak]

Hi there,

I am interested in adding .js files to the Cognos server. I added a sample .js file of functions to ./webcontent/bi/js/test.js, but I don't know the correct way to reference it in the Cognos layout using an HTML item. I tried, but it says the function is undefined.

Please, if I made a mistake when writing this topic in the forum, forgive me.

Best regards,

Mirza

[dougp]

The basic problem I see here is

https://www.ibm.com/support/pages/lifecycle/search/?q=Cognos%20Business%20Intelligence&ibm-search=Search

Product	End of Support
Cognos Business Intelligence 10.2.x	2018-04-30
Cognos Analytics 11.0.x	2021-09-30
Cognos Analytics 11.1.x	2024-04-30

You may want to consider planning an upgrade to at least 11.2.4FP3 before doing too much more work.

The current way to include JavaScript customization is significantly different:
https://public.dhe.ibm.com/software/data/sw-library/cognos/mobile/scriptable_reports/index.html

[MirzaTinjak]

Thank you on response dougp.

After considering version, correct version is 11.2.1. so i have custom control module way of referencing javascript. ( regarding this, this post should be moved to version 11 subforum ). I find a way to reference .js file but didn't find examples of manipulating with oControlHost. Problem which I am trying to solve is the following:

Let an input list with one column be given. Using javascript, it is necessary to add the first column consisting of textboxes for input. There are as many textboxes as there are rows in the input list column. It is necessary to add a third column which is the sum of the entered textbox and the second column. The result is updated after entering it in any textbox, and remains remembered. It is also necessary for the result (3 columns) to be available in the query later so that further columns can be performed.

The problem can be simplified to the following:
- How to capture a list in javascript to refer to child objects?
- When I add a new column, what type of HTML object must be added to appear as a new column (in the case of the first column textbox, what is the third column)?
- How to ensure that the entry is saved even page up, page down?

EDIT:

Code Select Expand

define( function() {

    "use strict";
   
    function dataEntry(){};
    dataEntry.prototype.initialize = function( oControlHost, fnDoneInitializing ) {

    var o = oControlHost.configuration;
    this.m_sListName = o ? o["List name"] : "List1";
    if(!window.sessionStorage.getItem(this.m_sListName+'Rw2UPD')) window.sessionStorage.setItem(this.m_sListName+'Rw2UPD','[]');
    fnDoneInitializing();
    }
    dataEntry.prototype.draw = function( oControlHost ) {

    var elm = oControlHost.container,
        list = oControlHost.page.getControlByName( this.m_sListName ).element,
        listHeaders = list.rows[0].childNodes;
        //listHCount = listHeaders.length;
       
       
    //Create a text node and store it in a variable
    let newNode = listHeaders[0].cloneNode(true);
    newNode.innerText = 'Enter value';
    newNode.style.width="100%";
    el.style.width
    let firstCellH = list.rows[0].insertCell(0);
    firstCellH.appendChild(newNode);
    firstCellH.style.width="100%";
        for (let i = 1; i < list.rows.length; i++) {
            // Dodajemo novu ćeliju u trenutni red (prva kolona)

            let textBox = document.createElement('input');
            textBox.type = 'text'; // Definišemo tip input polja kao 'text'
           
            let td = document.createElement('td');
            td.appendChild(textBox);
            let firstCell = list.rows[i].insertCell(0);
        firstCell.appendChild(td);
            // Kreiramo novi textbox i dodajemo ga u prvu ćeliju
           
   
            // Dodajemo novu ćeliju u trenutni red (treća kolona)
            //let thirdCell = table.rows[i].insertCell(2);
        }
       
}
    return dataEntry;
});
I provided code what I have done until now.