例：當我們用常規取值的時候，雖然B3單元格錄入了值，但是在光標不離開B3的前提下，用JS只獲取到了控制而不是實際的值“2”。
想獲得B3的值，需要在空白處點擊下鼠標，讓文本框的左上角的紅三角出現才可以。
優化過后則可以將光標強制跳轉到A2單元格，使其獲得光標，進而強制B3單元格刷新值。
既然任意點擊空白處就可以，那么我們就用JS來強制跳轉光標實現同樣的功能。
模板制作
模板樣式設計如下，A3和B3單元格添加文本控件，C3單元格為A3和B3相加值，D3和E3單元格添加按鈕控件：
“直接相加”按鈕的JS
D3控件名稱為直接相加，添加一個點擊事件
var A3 = contentPane.curLGP.getCellValue("A3");
alert("a3的值:"+A3);
alert("b3的值:"+B3);
“優化后”按鈕的JS
E3控件名稱為優化后，添加一個點擊事件
var B3 = contentPane.curLGP.getCellValue("B3");
var A3 = contentPane.curLGP.getCellValue("A3");
alert("a3的值:"+A3);
alert("b3的值:"+B3);
contentPane.curLGP.selectTDCell(“A2”)：表示的是，將光標強制跳轉到A2單元格，也就相當于用鼠標點擊了一下A2單元格，使其獲得光標，進而強制B3單元格刷新值。
常見場景
用戶通過文本框填報了值，而需要對這個值進行取出判斷的時候，經常會取空值，只有用戶點擊了空白區域，才可以正常取值。
比如：用戶填寫了手機號碼，就可以跳轉到領取獎品的頁面，若手機號碼是最后一個填報欄，填寫后，用戶直接提交，系統則會認為，手機號碼一欄為空。
添加加載結束事件
點擊菜單模板>模板web屬性>分頁預覽設置，選擇“為該模板單獨設置”，添加一個“加載結束”后事件，如下圖所示：
JS代碼如下：
setTimeout(function(){
//當鼠標點擊時
$(".content-container").click(function()
{
//如果頁面正在執行事件（滾動）
if(interval)
{
//取消事件（滾動）
clearInterval(interval);
}
})
var old=-1;
//按照指定周期不斷的調用滾動事件
var interval=setInterval(function()
{
currentpos=$(".content-container")[0].scrollTop;
if (currentpos==old){
//取消事件（滾動）
clearInterval(interval);
//重新加載頁面
window.location.reload();
}
else
{
old=currentpos;
//以25MS的速度每次滾動3.5PX
$(".content-container")[0].scrollTop=currentpos+3.5;
}
}
,25);
},2000)
保存與預覽
保存模板，點擊分頁預覽，就會出現上面的自動滾動效果。如果想要停止滾動的話，用鼠標左鍵點擊一下窗口即可。
如上圖所示，新建一個html頁面，定義一個工具欄和一個iframe，工具欄中定義上圖所示的按鈕，iframe中嵌入FineReport中的報表，如下圖：
FineReport報表設置
打開設計器，找到上面web頁面中嵌入的那張模板，由于要使用自定義按鈕作為工具欄，那么FineReport報表內置的工具欄就無需顯示出來。點擊模板>模板web屬性>分頁預覽設置，去掉使用工具欄前面的勾選，如下圖：
自定義導出按鈕
Web頁面中定義了9個自定義導出按鈕，那么怎樣才能實現導出操作呢？
FineReport導出操作的JS接口為：
導出PDF：exportReportToPDF()
導出[Excel](分頁)：exportReportToExcel('page')
導出[Excel](原樣)：exportReportToExcel('simple')
導出[Excel](分頁分sheet)：exportReportToExcel('sheet')
導出[Excel](分頁導出xls格式)：exportReportToExcel('page_isExcel2003')
導出[Excel](原樣導出xls格式)：exportReportToExcel('page_isExcel2003')
導出[Excel](分頁分sheet導出xls格式)：exportReportToExcel('page_isExcel2003')
導出[圖片]：exportReportToImage('gif')【括號里面可以更換參數，比如說png，jpg等等圖片類型】
導出[word]：exportReportToWord()
故，各個按鈕的點擊事件應用調用上述的JS接口來實現其對應的導出格式，比如說導出PDF，那么其按鈕的onclick時間為：
onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToPDF()"
docment.getElementById('reportFrame')是獲取到iframe框架，然后通過contentWindow得到報表窗口，并拿到contentPane這個報表容器，最后就可以從容器中調用各種導出接口的方法了。
其他的幾個按鈕的導出事件這里就不一一講解了。
完整代碼
根據上述同樣的方法為其他幾個按鈕添加導出事件，完整代碼如下：
<html> <head> <title>FineReport自定義導出</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <fieldset> <div id="toolbar"> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToPDF()">導出[PDF]</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('page')">導出[Excel](分頁)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('simple')">導出[Excel](原樣)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('sheet')">導出[Excel](分頁分sheet)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('page_isExcel2003')">導出[Excel](分頁導出xls格式)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('simple_isExcel2003')">導出[Excel](原樣導出xls格式)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToExcel('sheet_isExcel2003')">導出[Excel](分頁分sheet導出xls格式)</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToImage('png')">導出[圖片]</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.exportReportToWord()">導出[Word]</button> </div> </fieldset> <iframe id="reportFrame" width="100%" height="100%" src='/WebReport/ReportServer?reportlet=doc/Primary/DetailReport/Details.cpt' ></iframe> </body> </html>效果查看
點擊不同的按鈕，即可看到其導出的結果：
例如：在使用地圖過程中，會發現很多地名顯示的位置偏離。這時候就需要使用JavaScript進行調控。以黑龍江和內蒙古為例，來介紹下如何在FineReport中利用JavaScript自定義地圖標簽。
新建地圖
以區域地圖為例，新建表單，拖入地圖（新特性）組件，地圖邊界選擇區域地圖下的中國（省級）：
數據準備
新建工作簿，添加數據集ds1，SELECT*FROM地圖1，選中圖表，選擇圖表屬性表-數據，如下圖所示：
選擇圖表屬性表-樣式>系列，如下圖設置，邊框設為藍色：
自定義JS顯示標簽
選擇圖表屬性表-樣式>標簽，內容選擇自定義，JS如下：
var total = '<div style="width:100%;height:100%;">';
if(this.name=="內蒙古自治區")
{total += '<div align=center style="margin-top:30px"><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">' +FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';}
else if(this.name=="黑龍江省")
{total += '<div align=center style="margin-top:100px;"><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+ FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';}
else{total += '<div align=center ><span style="font-size:25px;color:'+FR.contentFormat(points[1].value, '')+'">'+FR.contentFormat(points[2].value, '#0.00')+'</span>'+this.name+'</div>';}
for(var i = 0, len = points.length-2; i < len; i++)
{total += ('<div align=center>'+FR.contentFormat(points[i].value, '#0.00')+'</div>');}
total+='</div>'; return total;}
div align=center style="margin-top當讀取名字為內蒙古自治區時候，我們進行margin顯示位置的調整，使其不顯示偏離
FR.contentFormat(value, '#.##%')進行數值格式自定義，后面的'#.##%'可以根據實際需求進行更改；
this.points這個參數在地圖中使用時表示同一個區域上的不同的系列的點
自定義JS顯示提示點
選擇圖表屬性表-樣式>提示，內容選擇自定義，JS如下：
var total = '<div style="width:100%;
background-color:#808080;color:white">';
total +='<div align=left style="font-size:16px">'+this.name+'</div>';
for(var i = 0, len = points.length-1; i < len; i++)
{total +='<div align=left style="font-size:13px">●'+points[i].seriesName+':'+FR.contentFormat(points[i].value, '')+'</div>';}
return total;}
此處做一個簡單的循環，循環展示我們前端設置的參數，并對參數做單獨的處理，包括控制字體大小，以及顯示格式。
保存與預覽
調整后效果如下，標簽位置正確，提示采用了自定義格式：
同步用戶信息
單點登錄的基礎，就是用戶信息的同步，FineReport的決策系統中有一個很強大的功能，可以自動幫助用戶實現用戶信息同步。具體菜單：決策系統-管理系統-用戶管理。點擊用戶管理菜單后，右側頁面右上角有一個“設置”按鈕，如下圖：
點擊“設置”，則會出現如下圖的界面。按照下圖中的配置進行對應的配置。
認證方式：選擇平臺內置認證。單點登錄的集成是通過平臺內置認證進行集成的。
用戶同步數據集：選擇“已開啟”
服務器數據集：服務器數據集是需要去帆軟報表的開發工具上進行配置。如下圖：
進入設計器，點擊菜單服務器-服務器數據集，新增一個數據集，選擇OA的數據源，寫入SQL“select * from hrmresource”，保存即可。
保存后，需要去本地的開發環境上找到對應的xml，復制到決策系統服務器端，才可使用。本地開發環境的xml路徑見上圖“保存路徑”后面的對應文件路徑。
通過EditPlus編輯器打開datasource.xml文件后，找到“OA用戶”這塊xml代碼。將這塊代碼復制到服務器上的datasource.xml上，路徑和/WebReport/WEB-INF/resourcr/datasource.xml，粘貼格式參見本地的開發環境。如下圖：
注：不要用記事本打開xml，保存可能會損壞xml。更新服務器文件時，做好備份。
繼續配置用戶同步
用戶名：XXX
姓名:XXX
密碼：XXX，注意，OA的密碼已經進行了32位大寫的MD5加密。
加密方式：不設置密碼加密
其他選填。
點擊保存，OK，決策系統已經開始在后臺執行了用戶同步了。只需要在決策系統中的用戶管理上查看同步的用戶信息結果即可。
泛微OA的登錄方式和如何編寫單點登錄
了解單點登錄之前，先了解下OA的登錄方式。泛微OA的登錄方式有2種。第一種，是通過頁面登錄進OA；第二種是，是通過E-Message上的快捷方式進入到OA。
這樣的話，如果實現FineReport和泛微OA集成的單點登錄，以上的兩種登錄方式均瑤實現這個效果。很多用戶和泛微的實施團隊會在OA的login.jsp上編寫單點登錄代碼。在login.jsp上編寫單點登錄代碼智能解決第一種登錄方式“通過頁面登錄進OA”。而通過E-Message上的快捷方式進入到OA是不能實現帆軟決策系統的單點登錄的。如果要實現兩種登錄方式的單點登錄，可以在泛微OA登錄后頁面上編寫單點登錄代碼。泛微OA登錄后頁面的jsp為“/ecology/wui/theme/ecology7/page/main.jsp”。
第一步，引入js代碼：
第二步，獲取當前用戶的登錄名和密碼的java代碼：
String nodeSql ="select loginid,password from HrmResource where id = " + user.getUID();
if (RecordSet.next()){
userpasswordstr = RecordSet.getString("password");
loginidstr = RecordSet.getString("loginid");
}
從上面的代碼可以很明顯的看到，這個和sql和rs的取值字段跟之前配置用戶同步信息對應的表和字段是一樣的。
第三步，編寫js代碼：
var password ="<%=userpasswordstr%>";
password = password.toUpperCase();//把密碼小寫字母轉換成大寫字母
var scr = document.createElement("iframe");
scr.src = "http://***.***.***.***:**/WebReport/ReportServer?op=touchfs&username="+username+"&__redirect__=false&password="+password;
這里是采用iframe的跨域單點登錄方式，所以在JS中需要創建一個iframe，然后在iframe上設置SRC。
第四步，保存main.jsp，備份服務器的main.jsp，更新main.jsp。
第五步，重新登錄OA，單點登錄成功。校驗方式，在OA的瀏覽器上，新建一個頁簽，輸入“http://***.***.***.***:**/WebReport/ReportServer?op=fs”，如果出現如下圖，且登錄名為自己的用戶，則表示單點登錄成功。但是。。。還沒完。
在泛微OA上配置決策系統入口
完成了上述的配置，但是OA用戶通過什么方式進入決策平臺呢？提供2個方式供參考。
第一，用系統管理員配置自定義左側菜單。
第二，設置用戶元素。
以上3點完成后，FineReport和OA的集成工作就大功告成了。
在程序中訪問WebService應用服務，將WebService返回的數據轉為程序數據集，然后在設計器中調用。
以axis1.4上的WebService為例，介紹其取數方式以及將數據轉換為WebService的程序數據集的過程。
WebService應用服務
如在Tomcat下的Axis工程中以jwa方式發布了一個WebService應用服務下TestWS2TDClient.jws，返回一個數組數據，如下：
public class TestWS2TDClient {
public String[][] getTD() {
String[][] a = {{"城市", "銷售員", "銷售額"},{"江蘇", "Anna", "230"},{"江蘇", "Alex", "190"},{"江蘇","Jack","320"},{"江蘇","Apple","210"},{"浙江","Faye","150"},{"浙江","Sammi","280"}};
return a;
}
}
以jws方式發布WebService：將寫好的TestWS2TDClient.java文件重命名TestWS2TDClient.jws，放在Tomcat\webapps\axis即可。
在java類中訪問WebService數據源
Java中發布一個soap請求，訪問TestWS2TDClient.java，得到返回的數據，代碼如下：
try {
String endpoint = "http://localhost:8080/axis/TestWS2TDClient.jws"; Service service = new Service(); //創建一個服務(service)調用(call) Call call = (Call) service.createCall(); // 通過service創建call對象 call.setTargetEndpointAddress(new java.net.URL(endpoint)); // 設置service所在URL call.setOperationName(new QName("http://localhost:8080/axis/TestWS2TDClient.jws","getTD")); // 調用service中的getTD方法
String[][] ret = (String[][])call.invoke(new Object[] {}); // getTD方法沒有參數，因此傳一個空的對象，得到service中getTD返回的數據
return ret;} catch (Exception e) { e.printStackTrace();
}Soap即簡單對象訪問協議，客戶端發送一個請求，調用相應的對象，然后服務器返回結果。這些消息是XML格式的，并且封裝成符合HTTP協議的消息。
在此期間需要引入axis.jar、commons-discovery-0.2.jar、commons-logging-1.0.4.jar、wadl4j-a.5.a.jar、log4j-1.2.8.jar、jaxrpc.jar六個包，可以在zxis\WEB-INF\lib下找到。
將獲得數據轉為程序數據集
訪問WebService后，該服務會返回數據給客戶端，該例中返回一個字符串數組。定義WebServiceTableData.java類，擴展AbstractTableData，將獲得的數組數據轉為程序數據集。完整代碼如下：
package com.fr.data;import javax.xml.namespace.QName;import org.apache.axis.client.Call;import org.apache.axis.client.Service;import com.fr.data.AbstractTableData;import com.fr.general.data.TableDataException;public class WebServiceTableData extends AbstractTableData{ private String[][] data; public WebServiceTableData() { this.data = this.getData();
} //獲取列數 public int getColumnCount() throws TableDataException { return data[0].length; } //獲取列的名稱為數組中第一行的值 public String getColumnName(int columnIndex) throws TableDataException { return data[0][columnIndex]; } //獲取行數為數據的長度-1 public int getRowCount() throws TableDataException { return data.length - 1; } //獲取值 public Object getValueAt(int rowIndex, int columnIndex) { return data[rowIndex + 1][columnIndex]; } public String[][] getData() { try { String endpoint = "http://localhost:8080/axis/TestWS2TDClient.jws"; Service service = new Service(); Call call = (Call) service.createCall(); call.setTargetEndpointAddress(new java.net.URL(endpoint)); call.setOperationName(new QName("http://localhost:8080/axis/TestWS2TDClient.jws", "getTD")); String[][] ret = (String[][])call.invoke(new Object[] {}); return ret; } catch (Exception e) { e.printStackTrace(); } return new String[][] {}; }}將編譯好的class文件拷貝到%FR_HOME%/WebReport/WEB-INF/classes/com/fr/data文件夾下。
設計器中調用程序數據集
新建報表，定義數據集，選擇程序數據集，選擇定義好的程序數據集WebServiceTableData.class，自定義數據集的名稱為ds1，啟動tomcat服務器，點擊預覽，效果如下：
上傳：使用文件控件上傳文件，以二進制流保存至數據庫字段中（字段類型必須是用于保存二進制數據的）；
下載：直接將二進制數據拖入單元格，設置單元格的其他屬性>用下載鏈接顯示二進制內容，就可以下載文件。
下面通過上傳一個txt文件至sql server數據庫中并下載為例來說明實現過程。Sqlite數據庫僅支持上傳，不支持下載的。
前提準備
準備一個txt文件，數據庫中創建一張數據庫表file，包含字段(filename[文本]、file[Blob對象])
數據庫不同可以保存文件的字段類型是不同的，以下列出常用數據庫保存二進制數據的字段類型：
上傳文件至數據庫
- 模板制作
前提準備好后，就可以制作一張填報模板，上傳文件到數據庫，文件以二進制數據流保存在數據庫字段中，模板設計界面如下，并按照圖上說明設置報表填報屬性：
如果是單文件上傳，則可嚴格控制，勾選只支持單文件上傳，還可以設置允許上傳的文件類型；如果是多文件上傳，就不需要勾選只支持單文件上傳這個勾選項了。
- 上傳提交
保存模板，進行填報預覽，上傳文件并提交，文件就會以二進制數據保存到數據庫中：
鼠標移至文件控件所在單元格，即B2，單擊右上角的編輯按鈕，進入編輯狀態，點擊上傳按鈕即可上傳文件，如下圖：
提交成功之后，在數據庫中可以看到數據。
下載
重新打開模板，添加數據庫查詢ds1，SQL語句為select *from file，將保存的數據查詢出來；將字段拖入到單元格中，并設置文件字段所在單元格的其他屬性>用下載鏈接顯示二進制內容，并設置下載后的文件名：
再次保存模板，填報預覽，就可以點擊下載了：
第一步：實例化一個注冊控件的接口
給四個信息 我們的控件類，界面類，圖標路徑，控件類型名字
package com.hg.free.plugin.customcombo.param; import com.fr.design.designer.creator.XComboBox;import com.fr.design.fun.impl.AbstractParameterWidgetOptionProvider;import com.fr.form.ui.Widget; public class WidgetRegister extends AbstractParameterWidgetOptionProvider { @Override public Class<? extends Widget> classForWidget() { return CustomComboBox.class; } @Override public Class<?> appearanceForWidget() { return XComboBox.class; } @Override public String iconPathForWidget() { return "/com/fr/web/images/combobox.png"; } @Override public String nameForWidget() { return "自定義下拉框"; } }
第二步，重寫控件類
package com.hg.free.plugin.customcombo.param; import com.fr.form.ui.ComboBox;import com.fr.ui.DataFilter; public class CustomComboBox extends ComboBox { private static final long serialVersionUID = 7169771062153345236L; @Override public String getXType() { return "customcombo"; } @Override protected DataFilter createDataFilter() { return new CustomComboBoxDataFilter(); }}
因為要改變過濾方式，就要重寫一個過濾器
package com.hg.free.plugin.customcombo.param; import com.fr.form.ui.ComboBoxDataFilter; public class CustomComboBoxDataFilter extends ComboBoxDataFilter { @Override public boolean isMatch(String txt, String filter) { if(null==txt && null!=filter)return false; if(null==txt && null==filter)return true; return txt.indexOf(filter)!=-1; }}
第三步，繼承前端控件JS
;(function($){ FR.CustomComboBoxEditor = FR.extend(FR.ComboBoxEditor, { _init: function () { FR.CustomComboBoxEditor.superclass._init.apply(this, arguments); } }); $.shortcut("customcombo", FR.CustomComboBoxEditor);})(jQuery); 好了~以上就是全部的代碼開發~然后寫個xml用ant打包成插件就可以了。
代碼解釋：
首先來看這段代碼是什么意思呢？
就是我定義了一個控件類型為CustomComboBoxEditor的控件，他繼承了ComboBoxEditor的全部方法和屬性，并且我把新定義的控件類型的標記聲明為customcombo，這個標記有啥用勒，其他用途就不說了，單單說在這里的用途，就是JAVA 本身是不能讓前端取生成什么控件的~而是通過告訴前端一個配置，前端的JS引擎（姑且這么稱呼他吧）~根據這個配置去執行對應的腳本生成對應的dom樣式之類的~shortcut你就這么理解~后臺返回一個配置是要生成customcombo這個控件~那么它就像一個map一樣找到了對應的鍵值FR.CustomComboBoxEditor~然后把該控件的配置丟到這個方法里面去執行。就生成我們的控件了。
因為這個例子中并沒有對前端有任何修改的要求~所以就沒做任何改動~下面看后臺。
我們這個例子是要修改模糊匹配的方式。
那么原來控件匹配的機制是怎么搞的，是這樣的：假設我是一個老板（媽蛋也只能假設一下了），現在我想了解一份紙質合同的細節，但是公司有一大坨紙質合同我怎么找呢~當然是請個秘書了（美女最好），我告訴她我要的合同大概是有些什么信息~然后她去找出來把最后找到的合同給我就可以了。
我們這里控件ComboBox就是老板，ComboBoxDataFilter就是秘書，就是這么個意思，這里每個秘書肯定都有自己找合同的一套方法，以前那個秘書是只要有點相關的就都找出來了，新來的這個秘書是只找老板提示的信息匹配到的合同~查找匹配的方法就是isMatch，這個代碼就是這樣的，代碼的開發其實只要仔細分析就能夠映射到現實生活中的很多事務處理上面~因為代碼也是人設計的，邏輯總逃脫不了人處理事務的思維。