Web報表頁面如何傳遞中文參數

1、場景描述

在用報表開發工具FineReport設計的web報表中,給iframe設置src嵌入某個報表時,往往會給報表傳遞初始的參數值,例如:


  

若參數名稱、參數值甚至報表名稱中包含中文或者特殊字符時,如果不進行編碼轉換,可能會出現一系列問題。比如下圖:

20150818094036635


今天我就來講講該如何如何傳遞中文參數。

2、使用cjkEncode對中文進行編碼轉換

使用cjkEncode對調用報表的路徑或參數進行編碼,報表獲取到參數後會自動進行解碼,保證不會出現亂碼等一系列情況。

cjkEncode是FR內部封裝好的編碼方法,在js中使用cjkEncode有兩種方式,該節我們舉例介紹。

2.1加載finereport.js使用cjkEncode

cjkEncode方法在FineReport的JS庫中已經預先提供了,用戶可以在自己的網頁中引入FineReport的JS庫,就可以使用FR.cjkEncode對中日韓文字符進行編碼,如下對調用報表的url進行cjkEncode:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
1.      <</code>html   
2.        <</code>head   
3.        <</code>title>FineReport Demo</</code>title   
4.        <</code>meta http-equiv="Content-Type" content="text/html; charset=GBK" />    
5.        <</code>script type="text/javascript" src="/WebReport/ReportServer?op=emb&resource=finereport.js"></</code>script 
6.        <</code>script language="javascript" 
7.          function autoLoad(){  
8.            var addr FR.cjkEncode("/WebReport/ReportServer?reportlet=/doc/Primary/Parameter/Parameter.cpt&地區=華東");  
9.            document.getElementByIdx_x("reportFrame").src addr;  
10.       
11.      window.onload autoLoad;   
12.    </</code>script 
13.    </</code>head   
14.    <</code>body   
15.      <</code>iframe id="reportFrame" width="900" height="400" ></</code>iframe   
16.    </</code>body 
17.  </</code>html>

finereport.js使用的是jquery框架,若用戶也使用了jquery,可能會造成衝突,這時建議不要引入finereport.js,而是將cjkEncode方法拷貝到頁面中直接使用,詳見下面的方法。

已完成示例請參照%FR_HOME%\WebReport|page_demo\parameter_ch.html

2.2直接調用cjkEncode

加載finereport.js再引用cjkEncode,一方面可能會引起js衝突,另一方面也加載了很多不必要的方法。

若用戶只需要使用該方法,可以將cjkEncode實現的代碼複製到網頁中或者用戶自己的js文件中,然後再引用cjkEncode。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
1.     <</code>html 
2.       <</code>head   
3.       <</code>title>FineReport Demo</</code>title   
4.       <</code>meta http-equiv="Content-Type" content="text/html; charset=GBK" />    
5.       <</code>script type="text/javascript" 
6.         //cjkEncode方法的實現代碼,放在網頁head中或者用戶自己的js文件中  
7.         function cjkEncode(text)                                                                            
8.           if (text == null)         
9.             return "";         
10.                
11.        var newText "";         
12.        for (var 0; text.length; i++)         
13.          var code text.charCodeAt (i);          
14.          if (code >= 128 || code == 91 || code == 93)  //91 is "[", 93 is "]".         
15.            newText += "[" code.toString(16) "]";         
16.          else         
17.            newText += text.charAt(i);         
18.                  
19.                
20.        return newText;         
21.      }
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章