1. How do I install Stimulsoft Reports.JS?

The installation package contains some JS and CSS files.
You must add the following line to the head of a document:

<script src="/stimulsoft.reports.js"></script>

Also, if you need to use the Stimulsoft Reports.JS viewer, add this code to the head of a document:

<link href="/stimulsoft.viewer.office2013.css" rel="stylesheet">
<script src="/stimulsoft.viewer.js" type="text/javascript"></script>

If you need to use the Stimulsoft Reports.JS designer, add this code to the head of a document:

<link href="/stimulsoft.designer.office2013.white.blue.css" rel="stylesheet">
<script src="/stimulsoft.designer.js" type="text/javascript"></script>

2. How do I show report in viewer?

To show a report in the viewer it is necessary to add this code in the head of a page:

<script type="text/javascript">
	var report = new Stimulsoft.Report.StiReport();
	report.loadFile("SimpleList.mrt");
	var viewer = new Stimulsoft.Viewer.StiViewer(null, "StiViewer", false);
	viewer.report = report;
	viewer.renderHtml("viewerContent");
</script>

This code displays in the HTML element with id="viewerContent" viewer loaded with the report. Read the documentation to learn what other ways are available to view the report in the viewer.

3. How do I design new report?

To load the designer it is necessary to add this code in the head of a page:

<script type="text/javascript">
	var designer = new Stimulsoft.Designer.StiDesigner(null, "StiDesigner", false);
	designer.renderHtml("designerContent");
</script>

This code displays in the HTML element with id="designerContent" designer with a new report.

4. How do I design specified report?

To load the designer with specified report it is necessary to add this code in the head of a page:

<script type="text/javascript">
	var report = new Stimulsoft.Report.StiReport();
	report.loadFile("SimpleList.mrt");
	var designer = new Stimulsoft.Designer.StiDesigner(null, "StiDesigner", false);
	designer.report = report;
	designer.renderHtml("designerContent");
</script>

This code displays in the HTML element with id="designerContent" designer loaded with specified report.

5. How do I save report changed in designer?

Use this code to save the report object to the JSON string representation:

var jsonString = report.saveToJsonString();

6. How do I print report?

Use this code to print a report without viewer and designer:

var report = new Stimulsoft.Report.StiReport();
report.loadFile("SimpleList.mrt");
report.render();
report.print();

7. How do I load data from XML?

Use this code to load data into the report from XML files with optional XSD schema:

var dataSet = new Stimulsoft.System.Data.DataSet("SimpleDataSet");
dataSet.readXmlSchemaFile("Demo.xsd");
dataSet.readXmlFile("Demo.xml");
var report = new Stimulsoft.Report.StiReport();
report.regData(dataSet.dataSetName, "", dataSet);

8. How do I load data from JSON?

Use this code to load data into the report from JSON files:

var dataSet = new Stimulsoft.System.Data.DataSet("SimpleDataSet");
dataSet.readJsonFile("Demo.json");
var report = new Stimulsoft.Report.StiReport();
report.regData(dataSet.dataSetName, "", dataSet);