1007
DEVELOPING
COLDFUSION 9 APPLICATIONS
Working with Documents, Charts, and Reports
Las
t
upda
te
d 8/5/2010
Linking to JavaScript from a pie chart
In the following example, when you click a pie wedge, ColdFusion uses JavaScript to display a pop-up window about
the wedge.
Create a dynamic chart with JavaScript:
1
Create an application page with the following content:
<script>
function Chart_OnClick(theSeries, theItem, theValue){
alert("Series: " + the ", Item: " + t ", Value: " + theValue);
}
</script>
<cfchart
xAxisTitle="Department"
yAxisTitle="Salary Average"
tipstyle=none
url="javascript:Chart_OnClick('$SERIESLABEL$','$ITEMLABEL$','$VALUE$');"
>
<cfchartseries type="bar" seriesLabel="Average Salaries by Department">
<cfchartData item="Finance" value="75000">
<cfchartData item="Sales" value="120000">
<cfchartData item="IT" value="83000">
<cfchartData item="Facilities" value="45000">
</cfchartseries>
</cfchart>
2
Save the page as chartdata_withJS.cfm in the myapps directory under the web root directory.
3
View the chartdata_withJS.cfm page in your browser:
4
Click the slices of the pie chart to display the pop-up window.
Creating Reports and Documents for Printing
You can use Adobe ColdFusion tags, functions, and tools to create pages and reports that are suitable for printing.
About printable output
Although all web browsers let you print HTML pages, HTML-format pages are not optimized for printed output. For
example, lack of control over line breaks, page breaks, headers, footers, and page numbers are just a few of the
problems that you encounter when designing reports and other pages meant to be printed.
In the context of ColdFusion, the term
printable output
refers to pages that include the following features:
•
Page numbers
•
Headers and footers
Code
Description
url = "Salary_Details.cfm?Item=$ITEMLABEL$"
When the user clicks a wedge of the pie chart, call the Salary_details.cfm
page in the current directory, and pass it the parameter named Item that
contains the department name of the selected wedge.