PB11.5+WEB客戶端編程技巧總結
PB11.5WEB客戶端編程技巧總結
一、概述
用PB11.5把現(xiàn)有C/S程序轉換成WEB應用程序后,保留了大部分C/S環(huán)境下的代碼,并且大部分都能執(zhí)行過去。但是在BS平臺下,原來的PB代碼從客戶端轉成了IIS上的服務代碼,原的“客戶端”就成了瀏覽器,轉換后的客戶端編程其實就是面向瀏覽器的編程。
根據(jù)目前我對PB11.5所了解的情況,PB11在代碼方面可以使用條件編譯方式嵌入.NET代碼,其實我感覺.net里能實現(xiàn)的內(nèi)容,用PB代碼也基本能實現(xiàn),.net里不能實現(xiàn)的,PB也可實現(xiàn)(如datawindow),但這些都屬于服務端的編程范疇,實際應用中很少會碰到在PB里再嵌入.net代碼的,除非要寫一些很特殊的代碼,所以,可以說,服務端方面僅用PB代碼就可以徹底解決。
但實際上,這種純PB代碼的程序一發(fā)布成WEB后,會存在不少問題,在C/S環(huán)境下,要完成一個操作往往需要多個交互過程,如“打開窗口、選擇行、輸入數(shù)據(jù)、返回、刷新頁面”這么一個過程,轉成B/S后,運行是這樣的“打開窗口(POSTBACK)、選擇行(POSTBACK)、輸入數(shù)據(jù)(回車后POSTBACK)、返回(POSTBACK)”,那么多的POSTBACK使得操作變得很笨重,就連簡單的一個MESSAGEBOX,都要2次POSTBACK:“打開消息窗(POSTBACK)、點確定(POSTBACK)”。因此,使用PB11開發(fā)WEB程序將要面臨一個很嚴峻的問題:如何提高客戶端的性能,減少POSTBACK次數(shù)。
值得慶幸的是,PB11.5的WEB頁面使用了AJAX技術,POSTBACK并不會產(chǎn)生整個頁面的提交,而是部分提交。另外,PB11.5還提供了不少客戶端的編程接口,可以通過這些編程接口進一步優(yōu)化頁面。那么,有哪些地方可以運用javascript和html代碼優(yōu)化頁面呢?
1、數(shù)據(jù)窗口對象appendedhtml屬性。
剛接觸PB11.5的WEB開發(fā)的時候,一定會被他的那么多unsupport屬性所蒙蔽,原先在C/S下絢麗多彩的界面,轉成B/S后變得暗淡無光,因此也就失去了進一步開發(fā)的樂趣。其實不然,PB提供了appendedhtml的屬性后,使WEB界面編程變得更為靈活,一個小小的appendedhtml,可以將DHTML、javascript等所有頁面技術嵌入到里面去?梢詫崿F(xiàn)的效果如:透明、垂直居中、漸變、鼠標移動特效等等。
查看發(fā)布成WEB后的頁面代碼,會發(fā)現(xiàn),appendedhtml里的內(nèi)容是放在里,也就是說,數(shù)據(jù)窗口的內(nèi)容轉成了WEB元素,如標簽轉成了,列就是。Appendedhtml的寫法:引號必須使用轉義符~如:modify(‘sfz.html.appendedhtml="style=~~"padding-top:2px;~~"’),至于如何設置元素屬性,可以查看《DHTML手冊》。
2、數(shù)據(jù)窗口事件。此方法是在數(shù)據(jù)窗口對象初始化的時候寫入對應的腳本,如:#IFDEFINEDPBWEBFORMTHEN
dw_1.JavaScriptFile="uo_dw.js"
dw_1.OnClientItemChanged="MyItemChanged"#ENDIF另外,在發(fā)布成WEB的時候,必須嵌入已寫好的javascript腳本,這些被腳本會在頁面的head區(qū)被包含進去。
經(jīng)過上面代碼一處理,數(shù)據(jù)窗口的事件被觸發(fā)后就會直接跳到javascript腳本去處理而不執(zhí)行回調(就是PB里寫的程序不會被執(zhí)行)。
那么,哪些事件支持腳本編程呢?根據(jù)PB11.5文檔所提供的技術說明,目前僅限于數(shù)據(jù)窗口內(nèi)事件處理,包括clicked、DoubleClicked、RButtonDown、ButtonClicked、ButtonClicking、ItemFocusChanged、ItemError、ItemChanged、RowFocusChanged。在指定客戶端事件腳本的時候,事件前都必須加”O(jiān)nClient”。二、客戶端程序的優(yōu)化思路
借助javascript腳本技術,我們可以對目前程序上的幾個操作瓶頸進行優(yōu)化。1、數(shù)據(jù)窗口的條件性POSTBACK。
如果不對datawindow進行腳本處理,那么如果事件內(nèi)有代碼,則將會在觸發(fā)該事件的時候執(zhí)行POSTBACK,這樣會有很多沒必要的POSTBACK。如,在itemchanged事件里寫入了對身份證輸入后進行檢查的代碼,在IE下運行的情況是,該數(shù)據(jù)窗口的任何列輸入完后都會執(zhí)行POSTBACK,有沒有辦法實現(xiàn)只輸入身份證的時候才POSTBACK呢?可以通過以下方法:
(1)在窗口的open事件里寫入腳本。#IFDEFINEDPBWEBFORMTHEN
dw_1.JavaScriptFile="uo_dw.js"
dw_1.OnClientItemChanged="MyItemChanged"#ENDIF
(2)腳本里寫入條件回調程序。
functionMyItemChanged(sender,rowNumber,columnName,newValue){if(columnName==‘sfz’){returnPBDataWindow_ItemChangedReject(sender,rowNumber,columnName,newValue);
}Else{//donothing}}
其中,PBDataWindow_ItemChangedReject為調用數(shù)據(jù)窗口的itemchanged事件,數(shù)據(jù)窗口提供的回調函數(shù),可以在PBDataWindow.js找到,查閱PB幫助文檔可以查看其具體用法。2、PB代碼向javascript腳本轉化。
首先,必須理解PB-WEB程序的運行模式,見下圖:數(shù)據(jù)庫SQL數(shù)據(jù)集EASERVER代理對象IISPBVMrequestIE代理對象response從上圖可以看出,IE與數(shù)據(jù)庫之間其實就是數(shù)據(jù)請求的關系,我們可以認為,除了需要從服務端下載數(shù)據(jù)和頁面加載的請求外,其他都是沒必要的請求。這些沒必要的請求包括:
1)messagebox。消息提示可以說是UI界面交互的最重要的環(huán)節(jié)之一,幾乎所有業(yè)務
操作都會涉及,很遺憾的是,除了數(shù)據(jù)窗口事件里的javascript支持本地消息提示外,目前還沒有一種辦法可以脫離IIS,直接在PB代碼里調用IE消息提示的方法。2)簡單的數(shù)據(jù)檢查。如登錄時的驗證碼、輸入格式校驗、身份證合法性檢查等,可以
直接在javascript里處理。
3)輔助性的數(shù)據(jù)輸入。包括下拉數(shù)據(jù)窗口、下拉日歷等。在傳統(tǒng)的C/S模式下,直接
打開一個窗口就可以實現(xiàn)下拉數(shù)據(jù)選擇功能,但是這種方法在WEB下已經(jīng)行不通,頻繁的POSTBACK會使操作變得笨重、緩慢,甚至比直接輸入來的慢。但是有些下拉的數(shù)據(jù)又需要從服務端取,這樣可以將下拉窗口設計成共用模塊啟動時直接裝載到頁面,在需要調用的地方用javascript代碼顯示出來,然后象服務端請求數(shù)據(jù),選擇數(shù)據(jù)后返回、設置數(shù)據(jù)、隱藏下拉窗口,這一過程只要一個POSTBACK,即數(shù)據(jù)請求過程。
4)頁面切換。在IE下打開多個業(yè)務窗口,這些窗口都已經(jīng)裝載到了IE下,可以通過
javascript腳本實現(xiàn)頁面顯示、隱藏,以提高響應速度。
5)窗口、對象的關閉、銷毀。類似此操作,可以直接在IE下完成,無需要再送到IIS
上處理。
6)實現(xiàn)回車后焦點切換。打開PB安裝文件所在路徑,打開F:\\Program
Files\\Sybase\\PowerBuilder11.5\\DotNET\\webroot\\scripts目錄下的dwcommon.js,并修改其代碼段。函數(shù)為:HTDW_inputKeyDown()代碼if(event.keyCode==9&&!event.ctrlKey&&!event.altKey&&!event.shiftKey)ProcessTab(obj);修改為if((event.keyCode==9||event.keyCode==13)&&!event.ctrlKey&&!event.altKey&&!event.shiftKey)ProcessTab(obj);實現(xiàn)按回車鍵的tab效果。
三、PB與javascript混合編程技巧1、使用PB提供的javascript函數(shù)
打開IIS目錄,在發(fā)布好的站點文件夾下,有個scripts文件夾,存放的是所有PB的內(nèi)置函數(shù),這些函數(shù)描述了客戶端的調用、回調方法,具體使用方法在PB文檔里有做了描述。
數(shù)據(jù)窗口對象(大部分數(shù)據(jù)窗口函數(shù)接口里都用sender做為參數(shù))可以引用的函數(shù)可以在dwcommon.js里的functionHTDW_DataWindowClass(name)里找到,如下圖:
如:this.SetItem=HTDW_SetItem;這行表示,可以調用數(shù)據(jù)窗口的SetItem()函數(shù)進行設置數(shù)據(jù)窗口值,至于SetItem參數(shù),可以查找HTDW_SetItem函數(shù)的參數(shù)結構。如下圖:
調用舉例:
數(shù)據(jù)窗口的回調函數(shù),可以在PBDataWindow.js里找到,上面已經(jīng)舉過例子,這里不做描述了。
2、靈活地操控WEB元素
WEB頁面上,每個元素都有一個ID值,是唯一標識該元素的鍵值。如表示“確定”按鈕的ID為ID_OK。
要在javascript里編寫程序實現(xiàn)與頁面元素交互,最重要的一點是要弄清楚從PB轉換成頁面后的元素的ID值,這些ID值是IIS發(fā)送過來的,與PB里的對象名有一定的對應關系。目前PB技術文檔沒有這方面的說明,但我們可以通過多種途徑來獲得這些元素ID。1)利用event對象獲得窗口事件的源、父對象
如,可以定義varo=window.event.srcElement;獲取鼠標在窗口上點擊的對象,通過o.parentElement可以獲取該對象的父對象。
2)通過getElementByName、getElementById、getElementsByTagName等方法獲取對象
ID。
3)通過alert消息提示將對象ID顯示出來。
有了這些ID,接下去如何操控界面元素,就和C/S編程差不多了,有關函數(shù)操作、屬性操作等可以參考javascript和DHTML相關資料。
應用舉例:
擴展閱讀:PB11.5 WEB客戶端編程技巧
PB11.5WEB客戶端編程技巧201*年09月11日星期六22:51一、概述
用PB11.5把現(xiàn)有C/S程序轉換成WEB應用程序后,保留了大部分C/S環(huán)境下的代碼,并且大部分都能執(zhí)行過去。但是在BS平臺下,原來的PB代碼從客戶端轉成了IIS上的服務代碼,原的“客戶端”就成了瀏覽器,轉換后的客戶端編程其實就是面向瀏覽器的編程。
根據(jù)目前我對PB11.5所了解的情況,PB11在代碼方面可以使用條件編譯方式嵌入.NET代碼,其實我感覺.net里能實現(xiàn)的內(nèi)容,用PB代碼也基本能實現(xiàn),.net里不能實現(xiàn)的,PB也可實現(xiàn)(如datawindow),但這些都屬于服務端的編程范疇,實際應用中很少會碰到在PB里再嵌入.net代碼的,除非要寫一些很特殊的代碼,所以,可以說,服務端方面僅用PB代碼就可以徹底解決。
但實際上,這種純PB代碼的程序一發(fā)布成WEB后,會存在不少問題,在C/S環(huán)境下,要完成一個操作往往需要多個交互過程,如“打開窗口、選擇行、輸入數(shù)據(jù)、返回、刷新頁面”這么一個過程,轉成B/S后,運行是這樣的“打開窗口(POSTBACK)、選擇行(POSTBACK)、輸入數(shù)據(jù)(回車后POSTBACK)、返回(POSTBACK)”,那么多的POSTBACK使得操作變得很笨重,就連簡單的一個MESSAGEBOX,都要2次POSTBACK:“打開消息窗(POSTBACK)、點確定(POSTBACK)”。因此,使用PB11開發(fā)WEB程序將要面臨一個很嚴峻的問題:如何提高客戶端的性能,減少POSTBACK次數(shù)。
值得慶幸的是,PB11.5的WEB頁面使用了AJAX技術,POSTBACK并不會產(chǎn)生整個頁面的提交,而是部分提交。另外,PB11.5還提供了不少客戶端的編程接口,可以通過這些編程接口進一步優(yōu)化頁面。那么,有哪些地方可以運用javascript和html代碼優(yōu)化頁面呢?1、數(shù)據(jù)窗口對象appendedhtml屬性。剛接觸PB11.5的WEB開發(fā)的時候,一定會被他的那么多unsupport屬性所蒙蔽,原先在C/S下絢麗多彩的界面,轉成B/S后變得暗淡無光,因此也就失去了進一步開發(fā)的樂趣。其實不然,PB提供了appendedhtml的屬性后,使WEB界面編程變得更為靈活,一個小小的appendedhtml,可以將DHTML、javascript等所有頁面技術嵌入到里面去?梢詫崿F(xiàn)的效果如:透明、垂直居中、漸變、鼠標移動特效等等。
查看發(fā)布成WEB后的頁面代碼,會發(fā)現(xiàn),appendedhtml里的內(nèi)容是放在里,也就是說,數(shù)據(jù)窗口的內(nèi)容轉成了WEB元素,如標簽轉成了,列就是。Appendedhtml的寫法:引號必須使用轉義符~如:modify(sfz.html.appendedhtml="style=~~"padding-top:2px;~~"),至于如何設置元素屬性,可以查看《DHTML手冊》。2、數(shù)據(jù)窗口事件。此方法是在數(shù)據(jù)窗口對象初始化的時候寫入對應的腳本,如:#IFDEFINEDPBWEBFORMTHENdw_1.JavaScriptFile="uo_dw.js"
dw_1.OnClientItemChanged="MyItemChanged"#ENDIF另外,在發(fā)布成WEB的時候,必須嵌入已寫好的javascript腳本,這些被腳本會在頁面的head區(qū)被包含進去。
經(jīng)過上面代碼一處理,數(shù)據(jù)窗口的事件被觸發(fā)后就會直接跳到javascript腳本去處理而不執(zhí)行回調(就是PB里寫的程序不會被執(zhí)行)。
那么,哪些事件支持腳本編程呢?根據(jù)PB11.5文檔所提供的技術說明,目前僅限于數(shù)據(jù)窗口內(nèi)事件處理,包括clicked、DoubleClicked、RButtonDown、ButtonClicked、ButtonClicking、ItemFocusChanged、ItemError、ItemChanged、RowFocusChanged。在指定客戶端事件腳本的時候,事件前都必須加”O(jiān)nClient”。二、客戶端程序的優(yōu)化思路
借助javascript腳本技術,我們可以對目前程序上的幾個操作瓶頸進行優(yōu)化。1、數(shù)據(jù)窗口的條件性POSTBACK。
如果不對datawindow進行腳本處理,那么如果事件內(nèi)有代碼,則將會在觸發(fā)該事件的時候執(zhí)行POSTBACK,這樣會有很多沒必要的POSTBACK。如,在itemchanged事件里寫入了對身份證輸入后進行檢查的代碼,在IE下運行的情況是,該數(shù)據(jù)窗口的任何列輸入完后都會執(zhí)行POSTBACK,有沒有辦法實現(xiàn)只輸入身份證的時候才POSTBACK呢?可以通過以下方法:
(1)在窗口的open事件里寫入腳本。#IFDEFINEDPBWEBFORMTHENdw_1.JavaScriptFile="uo_dw.js"
dw_1.OnClientItemChanged="MyItemChanged"#ENDIF
(2)腳本里寫入條件回調程序。
functionMyItemChanged(sender,rowNumber,columnName,newValue){if(columnName==sfz)
{returnPBDataWindow_ItemChangedReject(sender,rowNumber,columnName,newValue);}Else
{//donothing}}
其中,PBDataWindow_ItemChangedReject為調用數(shù)據(jù)窗口的itemchanged事件,數(shù)據(jù)窗口提供的回調函數(shù),可以在PBDataWindow.js找到,查閱PB幫助文檔可以查看其具體用法。2、PB代碼向javascript腳本轉化。
首先,必須理解PB-WEB程序的運行模式,見下圖:
從上圖可以看出,IE與數(shù)據(jù)庫之間其實就是數(shù)據(jù)請求的關系,我們可以認為,除了需要從服務端下載數(shù)據(jù)和頁面加載的請求外,其他都是沒必要的請求。這些沒必要的請求包括:1)messagebox。消息提示可以說是UI界面交互的最重要的環(huán)節(jié)之一,幾乎所有業(yè)務操作都會涉及,很遺憾的是,除了數(shù)據(jù)窗口事件里的javascript支持本地消息提示外,目前還沒有一種辦法可以脫離IIS,直接在PB代碼里調用IE消息提示的方法。
2)簡單的數(shù)據(jù)檢查。如登錄時的驗證碼、輸入格式校驗、身份證合法性檢查等,可以直接在javascript里處理。
3)輔助性的數(shù)據(jù)輸入。包括下拉數(shù)據(jù)窗口、下拉日歷等。在傳統(tǒng)的C/S模式下,直接打開一個窗口就可以實現(xiàn)下拉數(shù)據(jù)選擇功能,但是這種方法在WEB下已經(jīng)行不通,頻繁的POSTBACK會使操作變得笨重、緩慢,甚至比直接輸入來的慢。但是有些下拉的數(shù)據(jù)又需要從服務端取,這樣可以將下拉窗口設計成共用模塊啟動時直接裝載到頁面,在需要調用的地方用javascript代碼顯示出來,然后象服務端請求數(shù)據(jù),選擇數(shù)據(jù)后返回、設置數(shù)據(jù)、隱藏下拉窗口,這一過程只要一個POSTBACK,即數(shù)據(jù)請求過程。4)頁面切換。在IE下打開多個業(yè)務窗口,這些窗口都已經(jīng)裝載到了IE下,可以通過javascript腳本實現(xiàn)頁面顯示、隱藏,以提高響應速度。
5)窗口、對象的關閉、銷毀。類似此操作,可以直接在IE下完成,無需要再送到IIS上處理。
6)實現(xiàn)回車后焦點切換。打開PB安裝文件所在路徑,打開F:\\ProgramFiles\\Sybase\\PowerBuilder11.5\\DotNET\\webroot\\scripts目錄下的dwcommon.js,并修改其代碼段。函數(shù)為:HTDW_inputKeyDown()代碼if(event.keyCode==9&&!event.ctrlKey&&!event.altKey&&!event.shiftKey)ProcessTab(obj);修改為if((event.keyCode==9||event.keyCode==13)&&!event.ctrlKey&&!event.altKey&&!event.shiftKey)ProcessTab(obj);實現(xiàn)按回車鍵的tab效果。
三、PB與javascript混合編程技巧1、使用PB提供的javascript函數(shù)
打開IIS目錄,在發(fā)布好的站點文件夾下,有個scripts文件夾,存放的是所有PB的內(nèi)置函數(shù),這些函數(shù)描述了客戶端的調用、回調方法,具體使用方法在PB文檔里有做了描述。
數(shù)據(jù)窗口對象(大部分數(shù)據(jù)窗口函數(shù)接口里都用sender做為參數(shù))可以引用的函數(shù)可以在dwcommon.js里的functionHTDW_DataWindowClass(name)里找到,如下圖:
如:this.SetItem=HTDW_SetItem;這行表示,可以調用數(shù)據(jù)窗口的SetItem()函數(shù)進行設置數(shù)據(jù)窗口值,至于SetItem參數(shù),可以查找HTDW_SetItem函數(shù)的參數(shù)結構。如下圖:
調用舉例:
數(shù)據(jù)窗口的回調函數(shù),可以在PBDataWindow.js里找到,上面已經(jīng)舉過例子,這里不做描述了。
2、靈活地操控WEB元素WEB頁面上,每個元素都有一個ID值,是唯一標識該元素的鍵值。如表示“確定”按鈕的ID為ID_OK。要在javascript里編寫程序實現(xiàn)與頁面元素交互,最重要的一點是要弄清楚從PB轉換成頁面后的元素的ID值,這些ID值是IIS發(fā)送過來的,與PB里的對象名有一定的對應關系。目前PB技術文檔沒有這方面的說明,但我們可以通過多種途徑來獲得這些元素ID。1)利用event對象獲得窗口事件的源、父對象
如,可以定義varo=window.event.srcElement;獲取鼠標在窗口上點擊的對象,通過o.parentElement可以獲取該對象的父對象。
2)通過getElementByName、getElementById、getElementsByTagName等方法獲取對象ID。3)通過alert消息提示將對象ID顯示出來。
有了這些ID,接下去如何操控界面元素,就和C/S編程差不多了,有關函數(shù)操作、屬性操作等可以參考javascript和DHTML相關資料。應用舉例:
…………引用
友情提示:本文中關于《PB11.5+WEB客戶端編程技巧總結》給出的范例僅供您參考拓展思維使用,PB11.5+WEB客戶端編程技巧總結:該篇文章建議您自主創(chuàng)作。
來源:網(wǎng)絡整理 免責聲明:本文僅限學習分享,如產(chǎn)生版權問題,請聯(lián)系我們及時刪除。