JS實現報表載入結束後自動捲動到最下方最右側

1.1 預期效果

普通報表選擇「分析預覽」或「填報預覽」時，由於報表沒有分頁，通常頁面較大。

有時使用者需要報表在頁面載入後，自動捲動到瀏覽器最下方或最右側，方便查看或填報最新的資料。如下圖所示：

1.2 實現思路

透過新增「載入結束」事件報表初始化時調整捲軸的位置實現此效果。

1.3 注意事項

1）該方案僅支援普通報表。

2）該方案不支援凍結列欄，否則方案失效。

3）該方案不支援使用自訂捲軸插件，否則方案失效。

2.1 準備範本

1）準備內建範本：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\LineForm\點選按鈕直接提交入庫.cpt。

點選可下載範本：點選按鈕直接提交入庫.cpt

開啟範本，範本樣式如下圖所示：

2）修改資料集 ds1 為：SELECT * FROM 產品 

2.2 新增載入結束事件

點選「範本>範本 Web 屬性>填報頁面設定」，選擇「為該範本單獨設定」，新增「載入結束事件」，如下圖所示：

JavaScript 程式碼如下：

setTimeout(function(){
  var y=contentPane.$contentPane[0].scrollHeight;//獲取頁面最大高度
  var x=contentPane.$contentPane[0].scrollWidth;//獲取頁面最大寬度
  contentPane.$contentPane.scrollLeft(x);//設定捲軸最左方位置
  contentPane.$contentPane.scrollTop(y);//設定捲軸最上方位置
},100)

注1：在頁面載入結束時，可能存在尚未設定完成的情況，使用 setTimeout() 延時函式，相容性更好。

注2：不支援多 sheet 報表。

2.3 效果預覽

儲存範本，點選「填報預覽」，PC 端預覽效果如下圖所示：

注1：如果桌上解析度較高，有時會看不到效果，可以縮減瀏覽器視窗，重新整理頁面再查看效果。

注2：不支援行動端。

點選下載範本：JS實現分析或填報報表載入後自動捲動到最下方或最右側.cpt