c_6.2.12 頁(yè)面12——添加訂單項(xiàng)

1、6.2.12 頁(yè)面12添加訂單項(xiàng)頁(yè)面12負(fù)責(zé)完成輸入新訂單的第二步，即添加訂單項(xiàng)。這是一個(gè)相對(duì)復(fù)雜的頁(yè)面，有4個(gè)區(qū)域：Product Catalog 報(bào)表區(qū)域、Order for報(bào)表區(qū)域、Order Progress 列表區(qū)域、Customer Info PL/SQL動(dòng)態(tài)區(qū)域。其中Order Progress 列表區(qū)域用于實(shí)現(xiàn)左側(cè)訂單輸入的步驟和進(jìn)度，和頁(yè)面11中的同名區(qū)域完全相同，在此不再贅述。下面著重介紹其他的3個(gè)區(qū)域。1Order for報(bào)表區(qū)域Order for報(bào)表區(qū)域用于顯示選中訂單的訂單項(xiàng)，或刪除選中訂單項(xiàng)。圖6-159 Order for報(bào)表區(qū)域Order for報(bào)表區(qū)域默認(rèn)情況

2、下會(huì)顯示在Product Catalog區(qū)域下方。怎樣設(shè)置，才能夠讓Order for報(bào)表區(qū)域顯示在Product Catalog區(qū)域右面而不是下面呢？看圖6-160所示的定義。圖6-160 區(qū)域定義將區(qū)域的列設(shè)為2是Order for報(bào)表區(qū)域顯示在Product Catalog區(qū)域右面的關(guān)鍵。如果訂單為空，沒(méi)有訂單項(xiàng)，顯示效果如圖6-159所示。此時(shí)Order for報(bào)表區(qū)域給出提示信息：There are no items associated with this Order. Click on Add to Order in the Product Catalog region to a

3、dd items to this order. 此段信息提示用戶(hù)訂單為空，單擊Product Catalog 報(bào)表區(qū)域中“Add to Order”鏈接可為訂單添加訂單項(xiàng)。注意：Order for報(bào)表區(qū)域的標(biāo)題后顯示了訂單所屬客戶(hù)的名稱(chēng)。單擊“Add to Order”后，頁(yè)面顯示如圖6-161所示。Order for報(bào)表顯示了已添加的訂單項(xiàng)。圖6-161 已添加的訂單項(xiàng)（1）動(dòng)態(tài)標(biāo)題Order for報(bào)表區(qū)域的標(biāo)題后顯示了訂單所屬客戶(hù)的名稱(chēng)，這是如何實(shí)現(xiàn)的呢？其實(shí)很簡(jiǎn)單，如圖6-162所示。標(biāo)題中使用了替代字符串：Order for &P12_CUSTOMER_NAME，將P12_CUSTO

4、MER_NAME項(xiàng)的值添加到了標(biāo)題中。圖6-162 顯示訂單所屬客戶(hù)名稱(chēng)2）報(bào)表提示消息當(dāng)報(bào)表區(qū)域沒(méi)有數(shù)據(jù)時(shí)，區(qū)域顯示了提示信息，如圖6-163所示。圖6-163 提示信息這是如何實(shí)現(xiàn)的？這是通過(guò)設(shè)置報(bào)表屬性的“消息”選項(xiàng)卡中的內(nèi)容實(shí)現(xiàn)的，如圖6-164所示。可以為報(bào)表設(shè)置兩類(lèi)消息：未找到任何數(shù)據(jù)時(shí)顯示的消息和存在多行數(shù)據(jù)時(shí)顯示的消息。圖6-164 提示信息定義3）匯總信息Order for報(bào)表區(qū)域最后一行顯示了價(jià)格的匯總。這里需要兩個(gè)設(shè)置：第一個(gè)設(shè)置，如圖6-165所示中將報(bào)表的SUM(C003)列的“總和”標(biāo)志勾選上。這是關(guān)鍵設(shè)置，這保證了報(bào)表會(huì)顯示匯總結(jié)果。但此時(shí)第一列會(huì)顯示Report

5、 Total，而不是Order Total。圖6-165 選中“總和”復(fù)選框第二個(gè)設(shè)置是為了報(bào)表匯總結(jié)果的第一列顯示定制內(nèi)容Order Total。如圖6-166所示，設(shè)置“中斷格式”部分的“打印報(bào)表總和時(shí)顯示此文本”屬性即可。圖6-166 設(shè)置中斷格式（4）列鏈接交互式報(bào)表中可以通過(guò)“鏈接列”來(lái)實(shí)現(xiàn)從報(bào)表到其他頁(yè)面的鏈接（參見(jiàn)頁(yè)面2說(shuō)明）。在SQL報(bào)表中，類(lèi)似功能是通過(guò)在列上添加鏈接來(lái)實(shí)現(xiàn)的。如圖6-167所示的報(bào)表的屬性，鏈接一列只有報(bào)表的remove列顯示為對(duì)號(hào)，這說(shuō)明 remove列定義了鏈接。圖6-167 定義鏈接單擊REMOVE列前的編輯圖標(biāo)，可以打開(kāi)此列的屬性定義頁(yè)面，并選擇“鏈

6、接”選項(xiàng)卡，如圖6-168所示。圖6-168 “鏈接”選項(xiàng)卡鏈接文本定義此列顯示給用戶(hù)的內(nèi)容，可以是文本，也可以是圖標(biāo)。此處顯示的是圖標(biāo)：。其中#IMAGE_PREFIX#是替代字符串，代表了圖標(biāo)的URL前綴，delete.gif 是APEX安裝時(shí)自帶的圖標(biāo)文件，當(dāng)鼠標(biāo)光標(biāo)滑過(guò)圖標(biāo)時(shí)顯示了title的內(nèi)容Remove from order。鏈接目標(biāo)是當(dāng)前頁(yè)面12，請(qǐng)求（REQUEST）是REMOVE，并且把C001列的值帶給項(xiàng)P12_PRODUCT_ID。Product Catalog 報(bào)表區(qū)域中“Add to Order”一列的實(shí)現(xiàn)方式同上面完全一樣，也是鏈接到本頁(yè)，只是發(fā)出的請(qǐng)求不同，發(fā)出

7、的請(qǐng)求是ADD。這兩個(gè)列鏈接分別觸發(fā)了兩個(gè)顯示用頁(yè)處理：Add Product to the ORDER Collection 和Remove Product from the ORDER Collection，實(shí)現(xiàn)了集合內(nèi)容的添加和刪除。（5）區(qū)域源Order for報(bào)表區(qū)域的源SQL語(yǔ)句如下：select c001, c002, to_number(c003), count(c002), sum(c003), Remove removefrom apex_collectionswhere collection_name = ORDERgroup by c001, c002, c003ape

8、x_collections 是一個(gè)視圖，用于查詢(xún)集合數(shù)據(jù)，其定義參見(jiàn)“集合內(nèi)容添加刪除”部分說(shuō)明。上面查詢(xún)了集合ORDER的數(shù)據(jù)，集合ORDER中的c001列存放產(chǎn)品ID，c002列存放產(chǎn)品名稱(chēng)，c003列存放產(chǎn)品價(jià)格，count(c002)表示訂單中同類(lèi)產(chǎn)品的數(shù)量（一種產(chǎn)品，可以多次通過(guò)單擊“Add to Order”添加到訂單），sum(c003)是同類(lèi)產(chǎn)品的價(jià)格匯總，remove是占位用，在報(bào)表中增加一列，用于刪除訂單項(xiàng)使用。2添加/刪除集合內(nèi)容兩個(gè)顯示用頁(yè)處理：Add Product to the ORDER Collection 和Remove Product from the OR

9、DER Collection，實(shí)現(xiàn)了對(duì)集合ORDER內(nèi)容的添加和刪除。集合ORDER是在頁(yè)面11中創(chuàng)建的（參見(jiàn)頁(yè)面11說(shuō)明）。集合用于臨時(shí)保存一個(gè)或多個(gè)復(fù)合變量，如記錄。主要用于緩存界面數(shù)據(jù)。例如，界面允許編輯多行數(shù)據(jù)，可將數(shù)據(jù)緩存在集合中，在單擊“修改”按鈕時(shí)一起提交。集合數(shù)據(jù)保存在數(shù)據(jù)表中，可以通過(guò)視圖APEX_COLLECTIONS來(lái)查詢(xún)，也可以通過(guò)APEX_COLLECTION程序包中提供的方法來(lái)查詢(xún)、添加、刪除和修改。在SQL工作室中查看視圖APEX_COLLECTIONS的定義，可以了解到數(shù)據(jù)保存在WWV_FLOW_COLLECTIONS數(shù)據(jù)表中，各列定義如下：序號(hào)列名數(shù)據(jù)類(lèi)型長(zhǎng)度

10、非空1COLLECTION_NAMEVARCHAR2255NOT NULL2SEQ_IDNUMBER22NOT NULL3C001VARCHAR24000NULLC002VARCHAR24000NULLC003VARCHAR24000NULL. . . . .51C049VARCHAR24000NULL52C050VARCHAR24000NULL53CLOB001CLOB4000NULL54MD5_ORIGINALVARCHAR24000NULL視圖APEX_COLLECTIONS中共有54列，每行數(shù)據(jù)代表一個(gè)集合元素。COLLECTION_NAME存放集合名稱(chēng)，SEQ_ID存放集合元素在集合

11、中的序列號(hào)。這兩列構(gòu)成表的組合主鍵。C001C050代表集合可以有最多50個(gè)VARCHAR2類(lèi)型的列，用于存放集合元素的屬性數(shù)據(jù)。CLOB001是字符大對(duì)象類(lèi)型，用于存儲(chǔ)長(zhǎng)度超過(guò)4000字節(jié)的數(shù)據(jù)。Message Digest Algorithm MD5（中文名為消息摘要算法第五版）為計(jì)算機(jī)安全領(lǐng)域廣泛使用的一種散列函數(shù)，用以提供消息的完整性保護(hù)。MD5的典型應(yīng)用是對(duì)一段信息（Message）產(chǎn)生信息摘要（Message-Digest），以防止被篡改。MD5_ORIGINAL 存放集合數(shù)據(jù)的原始信息摘要，可用于判斷集合中的數(shù)據(jù)是否發(fā)生了改變。例如：如果重新根據(jù)集合數(shù)據(jù)利用MD5計(jì)算了信息摘要和

12、MD5_ORIGINAL進(jìn)行比較，如果相同則說(shuō)明集合數(shù)據(jù)沒(méi)有改變；否則就說(shuō)明集合數(shù)據(jù)發(fā)生了改變。處理Add Product to the ORDER Collection 添加選中產(chǎn)品到訂單集合，代碼如下：for x in (select * from demo_product_info where product_id = :P12_PRODUCT_ID)loop apex_collection.add_member(p_collection_name = ORDER, p_c001 = duct_id, p_c002 = duct_name, p_c003 = x.li

13、st_price, p_c004 = 1);end loop;代碼中apex_collection.add_member過(guò)程向集合ORDER添加了一個(gè)元素，c001列存放產(chǎn)品ID，c002列存放產(chǎn)品名稱(chēng)，c003列存放產(chǎn)品價(jià)格，c004存放了數(shù)字1。處理Remove Product from the ORDER Collection將選中產(chǎn)品從訂單集合中刪除，代碼如下：for x in (select seq_id, c001 from apex_collections where collection_name = ORDER and c001 = :P12_PRODUCT_ID)loopa

14、pex_collection.delete_member(p_collection_name = ORDER, p_seq = x.seq_id);htp.p(removed an item);end loop;代碼中apex_collection.delete_member從集合ORDER中刪除一個(gè)元素，元素由序列號(hào)seq_id指定，而seq_id由WHERE條件中的產(chǎn)品ID確定。集合中的數(shù)據(jù)可通過(guò)單擊調(diào)試工具欄中的session按鈕，打開(kāi)會(huì)話(huà)狀態(tài)頁(yè)面來(lái)查看。注意要先選擇查看內(nèi)容為“集合”，然后再單擊“開(kāi)始”按鈕。集合中的具體數(shù)據(jù)和當(dāng)前輸入訂單的訂單項(xiàng)有關(guān)，你看到的結(jié)果可能和此處不同，如圖6

15、-169所示。圖6-169 查看集合中的數(shù)據(jù)3Product Catalog 報(bào)表區(qū)域此區(qū)域的一個(gè)看點(diǎn)是：?jiǎn)螕鬚roduct Catalog 報(bào)表區(qū)域中Product Name列中的產(chǎn)品名稱(chēng)超鏈接，就會(huì)打開(kāi)一個(gè)新的頁(yè)面，顯示頁(yè)面20。怎樣才能在新窗口中打開(kāi)鏈接頁(yè)面呢？首先，可以查看Product Catalog 報(bào)表區(qū)域的源定義：select product_id, | htf.escape_sc(product_name) | product_name, list_price, Add to Order add_to_orderfrom demo_product_infowhere prod

16、uct_avail = Y注意粗體部分代碼，這是產(chǎn)品名稱(chēng)列的定義，其中htf.escape_sc函數(shù)將產(chǎn)品名稱(chēng)中的特殊符號(hào)如 和 & 等標(biāo)記和字符轉(zhuǎn)換為實(shí)體引用 < 和 &，然后通過(guò)連接字符串定義了一個(gè)超鏈接，通過(guò)超鏈接調(diào)用了JavaScript的方法productPopup(product_id)。那么JavaScript的方法productPopup又是在何處定義的呢？從圖6-170中可以看到，HTML標(biāo)頭（Header）中有JavaScript定義。圖6-170 HTML標(biāo)頭單擊HTML標(biāo)頭后的鏈接，即可看到方法productPopup的定義，如下所示。 function p

17、roductPopup (productID) var url; url = f?p=&APP_ID.:20:&SESSION.:P20_PRODUCT_ID: + productID; html_PopUp(url,ProductInfo,700,400,1,1); 上面代碼中通過(guò)調(diào)用html_PopUp方法，在彈出式窗口中打開(kāi)了url說(shuō)明的頁(yè)面，并把產(chǎn)品ID傳遞給了P20_PRODUCT_ID頁(yè)面項(xiàng)。這就是頁(yè)面20在新窗口中打開(kāi)的秘密。另外，注意圖6-171中勾選了LIST_PRICE排序標(biāo)志，說(shuō)明此報(bào)表可以根據(jù)LIST_PRICE列進(jìn)行排序顯示。圖6-171 排序顯示注意看如圖6-172

18、所示的顯示效果。List Price 列標(biāo)題下面的橫線(xiàn)說(shuō)明此列是可以排序的。向下的三角表明現(xiàn)在是按降序顯示，單擊List Price 列標(biāo)題可以實(shí)現(xiàn)排序方式的轉(zhuǎn)換。圖6-172 排序效果4Customer Info PL/SQL動(dòng)態(tài)區(qū)域Customer Info 區(qū)域是PL/SQL動(dòng)態(tài)區(qū)域。PL/SQL動(dòng)態(tài)區(qū)域的特點(diǎn)是區(qū)域內(nèi)容由一段PL/SQL代碼來(lái)定義。頁(yè)面生成時(shí)，執(zhí)行PL/SQL代碼，由代碼輸出的HTML標(biāo)記動(dòng)態(tài)組織一段HTML代碼作為頁(yè)面的組成部分。下面是區(qū)域源中的代碼。begin for x in (select * from demo_customers where customer

19、_id = :P11_CUSTOMER_ID) loop htp.p(htf.escape_sc(x.cust_first_name) | | htf.escape_sc(x.cust_last_name) | ); htp.p(htf.escape_sc(x.cust_street_address1) | ); if x.cust_street_address2 is not null then htp.p(htf.escape_sc(x.cust_street_address2) | ); end if; htp.p(htf.escape_sc(x.cust_city) | , | x.c

20、ust_state | | htf.escape_sc(x.cust_postal_code); end loop;end;代碼中首先使用游標(biāo)返回了P11_CUSTOMER_ID項(xiàng)選擇客戶(hù)的所有信息。然后調(diào)用了htp.p過(guò)程和htf函數(shù)。htp.p過(guò)程的作用是向客戶(hù)端輸出一段HTML代碼。htf函數(shù)的作用是返回一段HTML代碼。htf.escape_sc函數(shù)的作用是轉(zhuǎn)義特殊字符，前面講過(guò)了。最后的結(jié)果是輸出了客戶(hù)的姓名、地址1 (cust_street_address1)、地址2（cust_street_address2）、城市和州以及郵政編碼，分4行顯示。上面的游標(biāo)中實(shí)際是一個(gè)單行查詢(xún)，因?yàn)?/p>

21、根據(jù)P11_CUSTOMER_ID最多只會(huì)返回一個(gè)客戶(hù)。也可以使用SELECT INTO 語(yǔ)句查詢(xún)客戶(hù)信息。使用游標(biāo)的好處是不會(huì)發(fā)生異常（不管是找不到客戶(hù)還是找到了多個(gè)客戶(hù)），也就不需要處理異常。5Place Order處理頁(yè)面12中需要說(shuō)明的還有計(jì)算P12_CUSTOMER_NAME、按鈕cancel和Place Order。計(jì)算P12_CUSTOMER_NAME 根據(jù)項(xiàng)P11_CUSTOMER_ID查詢(xún)出客戶(hù)姓名。按鈕cancel和Place Order分別觸發(fā)兩個(gè)分支，分別轉(zhuǎn)到頁(yè)面4和頁(yè)面14。在轉(zhuǎn)到頁(yè)面14之前，要執(zhí)行Place Order處理。處理代碼如下：declare l_ord

22、er_id number; l_user_id number;begin - Fetch values that need to be inserted into the Order Header select user_id into l_user_id from demo_users where user_name = :APP_USER; select demo_ord_seq.nextval into l_order_id from dual; - Insert a row into the Order Header table insert into demo_orders values (l_order_id, :P11_CUSTOMER_ID, null, sysdate, l_user_id); commit; - Loop th