基於Birt4.6實現報表表格數據的可編輯

奇葩需求:客戶要求某業務系統中生成的報表數據可以編輯。爲響應客戶的需求,本文基於Birt 4.6實現報表數據的可編輯(僞修改)。

BIRT 是以 Java 和 JavaEE 爲基礎爲 Web 應用程序開發的基於 Eclipse 的開源報表系統,其本身並不支持報表數據的修改。因此想要實現報表數據的可編輯,需要修改生成報表的渲染頁面。本文的方案是在報表生成頁面引入Jquery實現報表表格數據的可編輯,這是一種簡單的快速實現方式,具體實現方案如下:

1)找到Birt渲染頁面

Birt的渲染頁面路徑../birt/webcontent/birt/pages/layout,不熟悉的朋友詳見Github請添加鏈接描述

3) 2) 引入Jquery並避免衝突

<script type="text/javascript" src="<c:url value='/statics/js/jquery-3.2.1.min.js'/>"></script>

去掉Jquery中的$混淆符號
<script>
$.noConflict();
</script>

3)實現表格的可編輯

jQuery("table td").dblclick(function(el) {
    var editTxt = el.target.innerText;
    if(editTxt!=""){
        var editCell = jQuery(el.target);
        var input = jQuery("<input type='text' value='" + editTxt +   "'/>");
        editCell.html(input); 
        input.trigger("focus"); 

        //失去焦點時
        input.blur(function() { 
            var newTxt = jQuery(this).val();
            editCell.html(newTxt);
        });

    }
});

最後求大家點個關注再走

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章