報表:JS實現填寫後自動移出光標,解決控件值刷新不及時

在報表的使用過程中,使用者在控件中輸入數據後,點擊其他按鈕用來獲取控件值進行傳參、鑽取或者運算時,經常不能馬上獲取道對應的值,需要點擊兩次才能獲取到控件值,或者需要在點擊按鈕前,先點一下其他位置以移開光標,此時才能獲取到控件值,這是因爲報表不能及時識別到當前控件中已編輯結束,導致報表不能馬上刷新控件值。如下圖:

在解決上述問題時,我也有搜索過相關的案例,然而並不能解決我的問題,網上大部分都是通過按鈕控件設置javascript事件,在點擊按鈕時,先將光標移出,再進行數據獲取,而這個會佔用了按鈕的一個事件,大部分情況下,我們是需要再次添加多一個javascript事件的,而這會導致使用者點擊按鈕時出現兩個事件選擇,還要依次操作,體驗感不夠圓滑。同時,這種做法不能自定義UI界面,不能改變報表的全局參數進行直接的數據查詢。

我在多次嘗試之後,發現還可以通過其他方式解決這一問題,可以做到實時刷新控件值,進行頁面數據過濾查詢。

1、報表界面設計:

其中,“確定”按鈕都是使用了動態參數,獲取前面控件的數據,傳入數據集並觸發數據集再次查詢,實時過濾數據,不再依賴參數面板的參數,可以由開發人員自定義整個報表界面。

2、javascript事件編輯:

優化前部分正常部署,不添加任何事件,優化後需要對應文本控件和下拉框控件寫入不同的javascript事件。

(一)文本控件

代碼如下:

var value = this.getValue(); 
contentPane.setCellValue(5,1,value);

(二)下拉框控件

代碼如下:

//移出焦點
contentPane.curLGP.selectTDCell();

此處,文本控件和下拉框控件的javascripts事件並不一樣,

文本控件:爲了實時更新控件值,在文本框中用的是“編輯後”事件,獲取當前控件的值,再將值賦值在當前控件,可以繼續編輯;而如果使用移出光標,會導致不能繼續輸入,需要在光標移回來纔可以繼續編輯,而且移動回來後控件內的值會被全部選中,需要再次單擊文本末才能實現繼續編輯,體驗感不夠圓滑,使用獲取值後再賦值的方案,就不會造成上面的問題,不需要使用者移出光標或其他操作,而且可以使報表的全局參數在實時變化,不需要做按鈕的點擊事件,更能方便“動態參數”直接做數據鑽取。

下拉框控件:使用者選中下拉框中某個數據後,直接觸發“編輯後”事件,移出光標,此處不像文本框一樣獲取值後再賦值,是因爲下拉框控件中有很多下拉數據,獲取值會導致報表卡死,無法繼續工作,所以此處直接移出光標即可,使報表的全局參數在選擇後直接變化,及時獲取控件值。

3、效果圖:

如上,就可以解決控件值刷新不及時的問題,使得報表全局參數在使用者的操作後直接更新,不需要使用者移出光標等操作,也不用暫用按鈕控件中的點擊一個事件,避免按鈕多事件的衝突。

而上面的示例,也沒有采用按鈕,是直接使用“動態參數”,不通過參數面板進行數據過濾查詢,直接在報表界面上設計參數查詢樣式,提供界面的方便性和自由設計。

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