Accessing rendered text values in JS

[SergiShy]

Hello!!

I'm trying to add some code when generating a report with the js viewer.

I have a text field in my report which contains data from a column in a database table. In this case, the column has integer values, but they represent three possible states of a document. I have a function in my own JS library that translates these values into readable text, for example 0 equals "Ready" while 1 equals "Processed".

In order to use my function to "translate" those integer values into text, I need to access the text component, but not the pre-render instance.

Code: Select all

var text=viewer.report.getComponents().getByName("StateText");

This returns the {} expression I used in the DesignerJS to get the values from the Database in my DataBand. Is there a way to access the rendered value of this text component in JS (0,1,2...)? Also, how can I replace the value of the rendered component with the text returned from my translate function?

I also have another question.

Code: Select all

report.dictionary.variables.list

I'm using this to quickly check all the variables in a report. Is there a similar function to access all the text elements in the report? (Without checking their parent elements, like data bands and such). I would like to filter all the text elements in the report, that have a particular prefix in their names, in order to determine if I need to apply my translation function or not.

Thanks in advance.

[Alex K.]

Hello,

The report.getComponents() retrieve component from report template. To get the component from rendered report you can use the following code:
report.renderedPages.getComponentByName()

Thank you.

[SergiShy]

Thank you very much. Now I can access the components in my rendered pages and read their values to call my custom translations and so on.

But now I have some more questions. Since I'm using viewer.renderHtml to render my report inside html elements, is there a way to alter the text of the rendered elements? I figured out a workaround: first rendering the original report inside a hidden div, then replacing the rendered pages' components with the correct text values and rendering again inside a visible div allows me to get the correct output.

However, unlike report.render() which allows instant access to rendered pages and their components, report.renderHtml takes some time, and I can't access the components I need to modify unless I'm using some timeout function.

Is there a way to determine the time taken by viewer.renderHtml() to render? I would like to render again with the correct texts as soon as possible.
If not, is there a way to alter the post-render component values before they are shown in the screen?

Thank you again.

[Alex K.]

Hello,

Please try to use the report.renderAsync() method.

Thank you.

[SergiShy]

Thanks for the reply.
I haven't had much time to test it until now, but now I'm getting these console errors:

Code: Select all

stimulsoft.reports.js:155 The database type is not supported by pure JavaScript. Please read <a href="http://www.stimulsoft.com/en/documentation/online/programming-manual/index.html?using_js_connect_to_mysql_and_ms_sql_database.htm">documentation</a>.
stimulsoft.reports.js:293 Uncaught TypeError: e is not a function
    at e._finallyFunction (stimulsoft.reports.js:293)
    at e.callFinally (stimulsoft.reports.js:155)
    at e.callCatch (stimulsoft.reports.js:155)
    at stimulsoft.reports.js:265
    at e.callCatch (stimulsoft.reports.js:155)
    at stimulsoft.reports.js:259
    at e.callCatch (stimulsoft.reports.js:155)
    at e.catch (stimulsoft.reports.js:155)
    at e._tryFunction (stimulsoft.reports.js:259)
    at e.callTry (stimulsoft.reports.js:155)

Also, if I remove the JS setTimeout, I get the same error directly in an alert.

This is my code in the moment of rendering:

Code: Select all

viewer.report.renderAsync();
//The code I was using earlier for the first "fake render"
		// viewer.renderHtml("falseViewer");
		// var falseViewer=document.getElementById("falseViewer");
		// falseViewer.parentNode.removeChild(falseViewer);
		
		
		setTimeout(function(){ 
		
		
		viewer.report.renderedPages.list.forEach(function(page,i,arr) {
			
			var components=page.getComponents().list;
			components.forEach(function(component,x,arr) {
				//My translation functions
				
			});
		});
		viewer.renderHtml("viewerContent");
		
		}, 1000);

If I use the "false rendering" approach the report works correctly, it just takes too long due to the timeout. However I don't know why report.renderAsync(); is giving me those errors. Is this method dependant on the type of database connection? I'm using Firebird.

Thank you for the help.

[Alex K.]

Hello,

We couldn't reproduce this bug. Please try to check the last prerelease build.

If the issue still present, please send us a simple project which reproduces the issue for analysis.

Thank you.