Page 1 of 1
Get text column from row Reports JS
Posted: Tue Jun 07, 2022 9:34 am
by ArnauINFR
Hi, I have a question.
How can I get the text of a specific column of the row.
I want to make a condition where, when the text of the x column of the row equals to a predefined word or text.
For example, if I have 3 columns and 2 rows with data.
Columns (ID, NAME, TYPE)
Data
1 (1, P.E., ACTIVITY)
2 (2, ALEX, USER)
I want to get the text of the TYPE column of the row to be able to change the backColor of the row.
Something like:
var condition = new Stimulsoft.Report.Components.StiCondition();
condition.backColor = Stimulsoft.System.Drawing.Color.cornflowerBlue;
condition.textColor = Stimulsoft.System.Drawing.Color.black;
condition.expression = "TEXT_INFO_OF_THE_ROW == ACTIVITY";
condition.item = Stimulsoft.Report.Components.StiFilterItem.Expression;
dataText.conditions.add(condition);
dataBand.components.add(dataText);
Re: Get text column from row Reports JS
Posted: Tue Jun 07, 2022 1:23 pm
by Max Shamanov
Hello,
Please check the following code:
Code: Select all
var condition = new Stimulsoft.Report.Components.StiCondition();
condition.backColor = Stimulsoft.System.Drawing.Color.cornflowerBlue;
condition.textColor = Stimulsoft.System.Drawing.Color.black;
condition.expression = 'Customers.ContactTitle == "Owner"';
condition.item = Stimulsoft.Report.Components.StiFilterItem.Expression;
var text = report.getComponentByName("Text3");
text.conditions.add(condition);
Thank you.
Re: Get text column from row Reports JS
Posted: Wed Jun 08, 2022 9:51 am
by ArnauINFR
Hi Max thank you for your reply.
I'm having some problems with the answer you give me.
I'm receiving all my data from an array with json. So I don't know how exactly gets the info like you say in:
Code: Select all
condition.expression = 'Customers.ContactTitle == "Owner"';
I'm also having some problems with:
Code: Select all
var text = report.getComponentByName("Text4");
text.conditions.add(condition);
If I don't comment on it, the page crashes and nothing from the report is displayed.
I just want to color the whole row if in the column Info4 the row is "ACTIVITY"
|----------------------------------------|
| Info1 | Info2 | Info3 | Info4 |
|----------------------------------------|
|
1 | Activity1 | | ACTIVITY |
| 2 | Arnau | Smith | Charles |
| 3 | Genis | Smith | Charles |
|
4 | jordi | ba | ACTIVITY |
|----------------------------------------|
I'm attaching an example to show what I have cause I'm a beginner and I know probably I'm explaining my problem in a wrong way
Let me know if you have a problem with that code.
Re: Get text column from row Reports JS
Posted: Wed Jun 08, 2022 9:54 am
by ArnauINFR
Code: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="icon" type="image/png" href="favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Taula Persones d'Activitat</title>
<!-- Report viewer Office2013 style -->
<link href="css/stimulsoft.viewer.office2013.whiteblue.css" rel="stylesheet">
<!-- Stimusloft Reports.JS -->
<script src="scripts/stimulsoft.reports.js" type="text/javascript"></script>
<script src="scripts/stimulsoft.viewer.js" type="text/javascript"></script>
<!-- Report viewer scripts, may be external -->
<script type="text/javascript">
var options = new Stimulsoft.Viewer.StiViewerOptions();
// Create Viewer component.
var viewer = new Stimulsoft.Viewer.StiViewer(options, "StiViewer", true);
function onLoadPage(){
var jsonData = JSON.parse(jsonString.value);
var dataSet = new Stimulsoft.System.Data.DataSet();
dataSet.readJson(jsonData);
var data = dataSet.tables.getByIndex(0);
var report = new Stimulsoft.Report.StiReport();
//Add data to datastore
report.regData("data", "data", dataSet);
//Fill dictionary
var dataSource = new Stimulsoft.Report.Dictionary.StiDataTableSource(data.tableName, data.tableName, data.tableName);
dataSource.columns.add(new Stimulsoft.Report.Dictionary.StiDataColumn("Info1", "Info1", "Info1"));
dataSource.columns.add(new Stimulsoft.Report.Dictionary.StiDataColumn("Info2", "Info2", "Info2"));
dataSource.columns.add(new Stimulsoft.Report.Dictionary.StiDataColumn("Info3", "Info3", "Info3"));
dataSource.columns.add(new Stimulsoft.Report.Dictionary.StiDataColumn("Info4", "Info4", "Info4"));
report.dictionary.dataSources.add(dataSource);
var page = report.pages.getByIndex(0);
//Create HeaderBand
var headerBand = new Stimulsoft.Report.Components.StiHeaderBand();
headerBand.height = 1;
headerBand.name = "HeaderBand";
page.components.add(headerBand);
//Create Databand
var dataBand = new Stimulsoft.Report.Components.StiDataBand();
dataBand.dataSourceName = data.tableName;
dataBand.height = 1;
dataBand.name = "DataBand"
page.components.add(dataBand);
//Create texts
var pos = 0;
var columnWidth = Stimulsoft.Base.StiAlignValue.alignToMinGrid(page.width / data.columns.count, 4, true);
var nameIndex = 1;
for (var index in data.columns.list)
{
var dataColumn = data.columns.list[index];
//Create text on header
var headerText = new Stimulsoft.Report.Components.StiText();
headerText.clientRectangle = new Stimulsoft.System.Drawing.Rectangle(pos, 1.5, columnWidth*1.5, 1);
headerText.text = dataColumn.caption;
headerText.horAlignment = Stimulsoft.Base.Drawing.StiTextHorAlignment.Center;
headerText.vertAlignment = Stimulsoft.Base.Drawing.StiVertAlignment.Center;
headerText.border.side = Stimulsoft.Base.Drawing.StiBorderSides.All;
headerText.name = "HeaderText" + nameIndex.toString();
headerText.brush = new Stimulsoft.Base.Drawing.StiSolidBrush(Stimulsoft.System.Drawing.Color.cornflowerBlue);
headerBand.components.add(headerText);
//Create text on Data Band
var dataText = new Stimulsoft.Report.Components.StiText();
dataText.clientRectangle = new Stimulsoft.System.Drawing.Rectangle(pos, 0, columnWidth*1.5, 1);
dataText.wordWrap = true;
dataText.text = Stimulsoft.System.StiString.format("{{0}.{1}}", data.tableName, dataColumn.columnName);
dataText.horAlignment = Stimulsoft.Base.Drawing.StiTextHorAlignment.Center;
dataText.vertAlignment = Stimulsoft.Base.Drawing.StiVertAlignment.Center;
dataText.name = "DataText" + nameIndex.toString();
dataText.border.side = Stimulsoft.Base.Drawing.StiBorderSides.All;
//Add highlight
var condition = new Stimulsoft.Report.Components.StiCondition();
condition.backColor = Stimulsoft.System.Drawing.Color.cornflowerBlue;
condition.textColor = Stimulsoft.System.Drawing.Color.black;
condition.expression = 'Table1.Info4 == "ACTIVITY"';
condition.item = Stimulsoft.Report.Components.StiFilterItem.Expression;
/*var text = report.getComponentByName("Text4");
text.conditions.add(condition);*/
dataBand.components.add(dataText);
pos = pos + columnWidth*1.5;
nameIndex++;
}
//Create FooterBand
var footerBand = new Stimulsoft.Report.Components.StiFooterBand();
footerBand.height = 0.5;
footerBand.name = "FooterBand";
page.components.add(footerBand);
//Create text on footer
var footerText = new Stimulsoft.Report.Components.StiText();
footerText.clientRectangle = new Stimulsoft.System.Drawing.Rectangle(0, 0, (columnWidth*1.5)*4, 0.5);
footerText.text = "Total de Registres: {Count()}";
footerText.horAlignment = Stimulsoft.Base.Drawing.StiTextHorAlignment.Right;
footerText.vertAlignment = Stimulsoft.Base.Drawing.StiVertAlignment.Center;
footerText.name = "FooterText";
footerText.border.side = Stimulsoft.Base.Drawing.StiBorderSides.All;
footerText.brush = new Stimulsoft.Base.Drawing.StiSolidBrush(Stimulsoft.System.Drawing.Color.cornflowerBlue);
footerBand.components.add(footerText);
//Create text component
var titleText = new Stimulsoft.Report.Components.StiText();
titleText.clientRectangle = new Stimulsoft.System.Drawing.Rectangle(0, 0, 30, 1);
titleText.wordWrap = true;
titleText.text = "COURSE: 2022-2023";
titleText.font = new Stimulsoft.System.Drawing.Font("Roboto-Black", 18);
titleText.horAlignment = Stimulsoft.Base.Drawing.StiTextHorAlignment.Center;
titleText.vertAlignment = Stimulsoft.Base.Drawing.StiVertAlignment.Center;
page.components.add(titleText);
viewer.report = report;
}
</script>
</head>
<body onload="onLoadPage()">
<label for="jsonString"></label>
<textarea name="jsonString" id="jsonString" style="width: 100%; height: 100px;">
{
"Table1" : [[[{"Info1":"1","Info2":"Activity1","Info3":"","Info4":"ACTIVITY"},{"Info1":"2","Info2":"Arnau","Info3":"Smith","Info4":"Charles"},{"Info1":"3","Info2":"Genis","Info3":"Smith","Info4":"Charles"}],[{"Info1":"4","Info2":"jordi","Info3":"ba","Info4":"ACTIVITY"}]]]
}
</textarea>
<div>
<script type="text/javascript">
// Show the report viewer in this place
if(<?php echo $jsonString;?> == null || <?php echo $jsonString;?> == "")
{
var errorForm = viewer.jsObject.controls.forms.errorMessageForm || viewer.jsObject.InitializeErrorMessageForm();
errorForm.show("No activities in this course");
}
else
{
viewer.renderHtml();
}
</script>
</div>
</body>
</html>
Re: Get text column from row Reports JS
Posted: Thu Jun 09, 2022 7:40 am
by Max Shamanov
Hello,
Please check attached example.
Thank you.
Re: Get text column from row Reports JS
Posted: Thu Jun 09, 2022 8:06 am
by ArnauINFR
Thank you Max that helped me a lot!
Works perfectly as I wanted.
Re: Get text column from row Reports JS
Posted: Thu Jun 09, 2022 8:09 am
by Max Shamanov
Hello,
You are welcome!