Calendar control , HTML DOM, Viewer Size issues. - Forum

kukkri · #1 (**permalink**) 10-16-2009, 12:49 PM

Hi Brian,
As per our discussion, the calendar control was erroring out when I select the previous or next or cancel buttons inside the QuickStart JSAPI tab. The reason for it was the basetag was set to a pre-determined value...and I needed to set iFrame = true in my navitem references to the JSAPI tab.

However, with the iFrame the viewer cut off the report with a scroll bar i.e the report viewer window was small. Changing the width and height values in setheight and setwidth did not help when the iframe = true.
It works when iFrame was not set.

Please advise.

bhanley · #2 (**permalink**) 10-22-2009, 06:25 AM

Can you post the HTML page containing the JSAPI code so we can review it? You can simply paste the markup into the thread or attach the file itself to the thread.

kukkri · #3 (**permalink**) 10-25-2009, 02:08 PM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-us">
<title>Mashup</title>

<style>
.mashupContainer {
font-family: Verdana, Tahoma, Arial;
font-size: 11px;
border: 1px solid #87AFDA;
margin: 3px;
}

.mashupTitle {
background: #D4E6FC;
font-size: 14px;
font-weight: bold;
color: #224499;
padding: 3px;
border-bottom: 1px solid #87AFDA;
}

.mashupContent {
padding: 3px;
}

.footer {
font-family: Verdana, Tahoma, Arial;
font-size: 10px;
}
</style>


<script src="http://nja:8700/iportal/jsapi" type="text/javascript"></script>
<script type="text/javascript" language="JavaScript">
var sumViewer = new actuate.Viewer("SummaryDiv");
// sumViewer.setReportName("/MashboardContent/QuickStart/NJ_Mashboard_Sample.rptdocument");
// sumViewer.setReportletBookmark("chart");
// sumViewer.setWidth(440);
// sumViewer.setHeight(320);

/** var uiopts = new actuate.viewer.UIOptions();
uiopts.enableToolBar(false);
uiopts.enableScrollControl(false);
sumViewer.setUIOptions(uiopts);

sumViewer.submit(); **/

//loadReportParams();
}

function loadReportParams(sel) {
$("RunReportButton").disabled = true;
//var path = "/MashboardContent/QuickStart/";
//reportName = path + sel.value
reportName = sel.value;
params = new actuate.Parameter("ReportParamDiv");
params.setReportName(reportName);
params.submit(afterParamInit);
}

function afterParamInit() {
$("RunReportButton").disabled = false;
}

function processParams() {
var mywindow = window.open('popup.html','reportwindow','width=600,height=400,toolbar=yes,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,copyhistory=no,resizable=yes');

if (!mywindow.opener)
mywindow.opener = this.window;
}

function getParams() {
return params;
}

function getReportName() {
return reportName;
}
</script>

</head>
<body onload="acload()">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>




<td style="vertical-align:top;">
<div class="mashupContainer">
<div class="mashupTitle">QA Report Selector</div>
<div class="mashupContent">
<span style="font-weight: bold">Report: </span>
<select style="font-size: 11px" onchange="loadReportParams(this)">
<option value="" selected><Select Report></option>
<option value="/MashboardContent/New Jersey/QA_SWAndRefTblVer.rptdesign">Software And Reference Table Versions</option>
<option value="/MashboardContent/New Jersey/QA_BadInspectionRecords.rptdesign">Bad Inspection Records</option>
<option value="/MashboardContent/New Jersey/QA_PIFEnrollActivateIssues.rptdesign">PIF Enrollment</option>
<option value="/MashboardContent/New Jersey/QA_OBDFailRatebyProtocol.rptdesign">PIF Enrollment</option>
<option value="/MashboardContent/New Jersey/QA_Inspmorethanoneinspection.rptdesign">Inspector Doing More Than One Inspection</option>
<option value="/MashboardContent/New Jersey/QA_WorkstationLockouts.rptdesign">Workstation Lockouts</option>
<option value="/MashboardContent/New Jersey/QA_ObdVinMismatch.rptdesign">OBD VIN Mismatch</option>
<option value="/MashboardContent/New Jersey/QA_CalibrationFailuresByType.rptdesign">Calibration Failures By Type</option>
<option value="/MashboardContent/New Jersey/QA_ManualVINEntered.rptdesign">Manual VIN Entered</option>
<option value="/MashboardContent/New Jersey/QA_ContinuousMonitorsStatus.rptdesign">Continuous Monitors Status</option>
<option value="/MashboardContent/New Jersey/sorttableclient.rptdesign">Sorting sample</option>
</select>
</div>
<div class="mashupContent" id="ReportParamDiv"></div>
<div class="mashupContent">
<button id="RunReportButton" onclick="processParams()" disabled>Run Report</button>
</div>
</div>
</td>
</tr>
</table>
<div class="mashupContainer" style="clear:both">
<div class="mashupContent" id="ReportDiv"></div>
</div>
</body>
</html>

bhanley · #4 (**permalink**) 10-26-2009, 06:11 AM

I do not see in your Javascript where you are actually loading the report. Is that happening in popup.html? I can follow the flow of the code through the instantiation of the parameter component, but then you invoke the pop-up and I an not seeing the completion. I am assuming that the final step is coded in popup.html.

If you can add the code in popup.html that should help me finish working this through.

Thanks!

kukkri · #5 (**permalink**) 10-26-2009, 12:40 PM

Here you go:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<style>
.mashupContainer {
font-family: Verdana, Tahoma, Arial;
font-size: 11px;
border: 1px solid #87AFDA;
margin: 3px;
}

.mashupTitle {
background: #D4E6FC;
font-size: 14px;
font-weight: bold;
color: #224499;
padding: 3px;
border-bottom: 1px solid #87AFDA;
}

.mashupContent {
padding: 3px;
}

.footer {
font-family: Verdana, Tahoma, Arial;
font-size: 10px;
}
</style>
<head>
<body onLoad="acload()">

<div class="mashupContainer" style="clear:both">
<div style="width:100%" class="mashupContent" id="popupDiv" ></div>
</div>

<script src="http://njacd01:8700/iportal/jsapi" type="text/javascript"></script>
<script language="javascript">

var viewer;
document.cookie = 'ac_standalone=true';

function acload() {
var url = "http://njacd01:8700/iportal";
actuate.load("viewer");
actuate.load("parameter");
actuate.initialize(url, null, "Administrator", "nj_dev", popupParams);
}

function popupParams() {

var params = opener.getParams();
params.downloadParameterValues(runReport);

}

function runReport(paramValues) {
var myReportName = opener.getReportName();

viewer = new actuate.Viewer("popupDiv");
//var mywindow = window.open('popup.html','reportwindow','width=600,height=400,toolbar=yes,location=no,directories=no,status=no,menubar=no,scrollbars=no,copyhistory=no,resizable=yes');
//var myelement = mywindow.document.getElementById("popupDiv");
//viewer = new actuate.Viewer(myelement.id);
viewer.setReportName(myReportName);
viewer.setParameterValues(paramValues);
viewer.setWidth(2000);
viewer.setHeight(1200);
//viewer.setWidth($("ReportDiv").offsetWidth - 20);
//viewer.setHeight($("ReportDiv").offsetHeight - 20);
viewer.submit();

}

</script>

<body>
<html>

bhanley · #6 (**permalink**) 10-26-2009, 03:08 PM

I am running these pages without any problem. Do you have fixed dimensions on the components in your BIRT report that could be limiting the screen real estate available to render into?

I pointed these two pages at the JSAPI samples bundled into the standard iServer install and it worked like a champ. The working samples were ONLY changed to point to the content. All the other code running is the same as your installation. This leads me to believe the problem may well be in the BIRT designs themselves.

kukkri · #7 (**permalink**) 10-27-2009, 10:34 AM

attached couple of my sample reports....not sure where the issue is.

bhanley · #8 (**permalink**) 10-28-2009, 10:06 AM

I took a look at the QA_SWAndRef... report. You have a lot of fixed dimensions in this report (Some as large as 13 inches). That is not ideal for the web as the dimensions you are rendering into (Such as the Pop Up window you are trying to use) can vary widely. Have you tried leveraging BIRT's auto-layout functionality by coding in relative widths through percentages? It may help BIRT deal with the available space when you request the content via JSAPI.

kukkri · #9 (**permalink**) 10-29-2009, 09:16 AM

I see....I will use that method and set the iFrame = true. That should help me correct?

kukkri · #10 (**permalink**) 10-29-2009, 02:03 PM

Hi Brian,
I went back and looked at the report...and it is set to Auto Layout by default.

No matter I change it to percentage....it returns back to inches. I tried changing the table width to % but it returned back to inches...so also with the columns.

Please advise.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode