第 8 章客戶端網頁的 XML

第 8 章客戶端網頁的XML

Data Island與Data Binding- 什麼是Data Island • 透過CGI、Perl技術或者更先進的PHP、ASP、ASP.NET與JSP…等動態網頁技術，提供瀏覽者檢視及處理伺服器上的資料。但是當瀏覽者越來越多時，伺服端的運算資源與網路頻寬將快速消耗。 • 為了降低客戶端對伺服端的依賴，微軟提出了將資料暫存在客戶端，並可直接在客戶端顯示與修改的機制。 • 這個技術使得伺服端可以一次就送出客戶端需要的資料，並由客戶端自行依需要處理，達到善用客戶端計算資源，減輕伺服端負擔的目的。這個暫存在客戶端的資料，被稱之為資料島（Data Island）。

Data Island與Data Binding- 微軟的Data Binding技術 • 微軟為了在HTML網頁內顯示與處理客戶端暫存資料（Data Island）的技術，提出了資料連結（Data Binding）技術，架構圖如下所示：

DSO物件的運用- 顯示HTML網頁內的XML文件 • 運用XML文件做為Data Island在HTML網頁運用XML標籤載入XML文件，做為Data Island，並建立DSO物件的語法如下： <XML id=物件名稱 src=XML文件名稱與位置 async=是否先載入> 文件內容 </XML> • 以下敘述將把描述『Access 2007 徹底研究』書籍資料的XML文件，建立為DSO物件，並命名為A1153。

DSO物件的運用- 顯示HTML網頁內的XML文件 • 以下敘述則從HTML網頁所在資料夾位置，載入名為A1153.xml的XML文件，並命名為A1153。請參考範例8-2的說明。

DSO物件的運用- 顯示HTML網頁內的XML文件 • 在HTML標籤內引用DSO物件在HTML網頁內與DSO物件連結，並顯示物件內資料的HTML標籤稱為DC（Data Consumers）。這類HTML標籤將透過設定datasrc屬性與dataFld屬性的方式，指定欲連結的DSO物件與欄位。 • 以下敘述將設定span標籤，連結至名為A1153的DSO物件，連結欄位為title。

DSO物件的運用- 運用表格顯示XML文件資料 • 以下敘述，將建立一個顯示bookdso物件內title、author與price欄位，所有資料的表格。

DSO物件的運用- 運用表格顯示XML文件資料 • 以下敘述將運用巢狀表格顯示包含penname與name的author巢狀元素。

DSO物件的運用- 屬性的顯示 • 運用DSO物件時，XML文件內元素的屬性可視為一個獨立的元素，直接將屬性名稱設定給HTML標籤的dataFld屬性，即可顯示屬性內容。 • 以下敘述將運用span標籤直接利用屬性名稱，列出book元素的sale屬性，且不需要指定該屬性所屬的元素。

DSO物件的運用- 屬性的顯示 • 其實瀏覽器會將元素的屬性，解譯為一個獨立的元素，然後將元素內容，建立為包含於原元素的$text元素。 • 以下為包含penname屬性的author元素。將被解譯為

DSO物件的運用- 可連結的HTML標籤 • 文字方塊在HTML網頁內，文字方塊將用於輸入文字，如下圖所示。 • 建立語法如下： <Inupt Type = text Name=文字方塊名稱 Value=傳出值> • 以下敘述將設定文字方塊連結至bookdso物件的title欄位。

DSO物件的運用- 可連結的HTML標籤 • 核取方塊核取方塊用於表達資料型態為布林值的欄位，如下圖所示。 • 建立語法如下： <Inupt Type = check Name=核取方塊名稱checked> • 以下敘述將設定核取方塊連結至bookdso物件的onsale欄位，表達該欄位值所代表的布林值。

DSO物件的運用- 可連結的HTML標籤 • 組合方塊組合方塊用於提供使用者以選取方式，設定資料的功能，如下圖所示。 • 建立語法如下： <SELECT Name=控制項名稱> <OPTION Value=傳出值1 Selected>選項1</OPTION> <OPTION Value=傳出值2>選項2</OPTION> …… <OPTION Value=傳出值N>選項N</OPTION> </SELECT>

DSO物件的運用- 可連結的HTML標籤 • 以下敘述，將建立一個連結至bookdso物件price欄位的組合方塊，並提供三種價格供使用者選取。

DSO物件的運用- 可連結的HTML標籤 • 選擇鈕用於代表連結欄位值，為數個值其中一個，如下圖所示。 • 建立語法如下： <Inupt Type = radio Name=選擇鈕名稱 Value=傳出值 checked> • 以下敘述將建立一個名為author的選項群組，並連結至bookdso物件的author欄位。

操作XML DSO物件的記錄集- 記錄集與欄位資料的取得 • 取得XML DSO物件的記錄集若想要動態瀏覽與操作客戶端瀏覽器的XML DSO物件，可以運用該物件的recordset物件，取得recordset物件的語法如下： DSO物件.recordset • 以下敘述將取得名為A1153之DSO物件的記錄集，並設定給objRS物件。

操作XML DSO物件的記錄集- 記錄集與欄位資料的取得 • 取得記錄集的欄位若欲取得記錄集的欄位時，語法如下： DSO物件.recordset(欄位名稱) • 以下敘述將取得DSO物件之記錄集的title欄位，並將值設定給客戶端網頁的title物件之innerText屬性。 • 以下敘述先將DSO物件的記錄集設定給objRS物件，再將名為title的欄位資料，設定給title物件的innerText屬性。

操作XML DSO物件的記錄集- 瀏覽XML DSO物件的記錄集 • 操作記錄集的方法取得recordset物件後，便可運用以下方法，操作記錄的瀏覽指標。 • 使用VBScript，呼叫recordset物件之方法的語法如下： DSO物件.recordset.方法 • 使用JavaScript（JScript），呼叫recordset物件方法的語法如下： DSO物件.recordset.方法()

操作XML DSO物件的記錄集- 瀏覽XML DSO物件的記錄集 • 記錄集屬性的運用下表為可使用的recordset物件屬性。 • 使用VBScript或JavaScript（JScript）取得屬性的語法如下： DSO物件.recordset.屬性

操作XML DSO物件的記錄集- 分頁顯示XML文件 • 除了以單筆方式顯示XML文件資料外，亦可運用表格，以分頁方式，列出數筆記錄。 • 運用時，必須在Table標籤內，設定下表的屬性。 • 操作顯示資料頁次的方法如下：

操作XML DSO物件的記錄集- 資料的修改與新增 • 運用8-2-4節所介紹的HTML控制項，可連結DSO物件內的資料，並透過這些控制項，修改DSO物件的內容。 • 至於DSO物件內資料的新增，則必須呼叫DSO物件的recordset物件的addnew()方法，此時，DSO物件將產生一筆新的記錄，並可由連結DSO物件的控制項輸入資料。

操作XML DSO物件的記錄集- 資料的搜尋與篩選 • 對於資料的搜尋，DSO物件或者是DSO物件的記錄集，並沒有提供任何方式。僅能透過自行比對記錄集欄位內資料的方式，進行資料的尋找與篩選。

操作XML DSO物件的記錄集- 資料的排序 • 對於客戶端DSO物件內資料的排序，必須藉由XSL檔的協助，執行XML文件的轉換。

操作XML DSO物件的記錄集- DSO物件的事件 • 下表為XML DSO物件可回應事件的說明，藉由回應事件的機會，程式設計師可執行一些動作。

操作XML DSO物件的記錄集- DSO物件的事件 • 欲定義回應某DSO物件特定事件的程序之語法如下： Sub DSO物件名稱_事件名稱() …… End Sub • 以下敘述將定義回應bookdso物件onrowenter事件的回應程序。

第 8 章 客戶端網頁的 XML