註解:

Dreamweaver CC (含) 以後版本的使用者介面已經簡化了。因此,您在 Dreamweaver CC 和更新版本中可能會找不到本文所描述的一些選項。如需詳細資訊,請參閱本文

關於主要和細節頁面

主要和細節頁面是一組用來組織和顯示資料集資料的頁面。這些頁面可以為網站的瀏覽者提供概要及詳細的檢視。主要頁面會列出所有的記錄,包含會顯示各筆記錄之其他相關資訊的細節頁面的連結。

主要頁面
主要頁面

細節頁面
細節頁面

建立主要和細節頁面時,您可以插入資料物件,在一次作業中建立主要頁面和細節頁面,或是使用伺服器行為,以較具彈性的自訂方式來建立主要和細節頁面。當您使用伺服器行為來建立主要和細節頁面時,請先建立主要頁面以顯示記錄清單,然後加入從清單連至細節頁面的連結。

建立主要頁面

在您開始之前,請確定已為網站定義資料庫連線。

  1. 若要建立空白頁面,請選取「檔案 > 開新檔案 > 空白頁面」、選取頁面類型,然後按一下「建立」。這個頁面便會成為主要頁面。
  2. 定義資料集。

    在「繫結」面板 (「視窗 > 繫結」) 中,按一下加號 (+) 按鈕,選取「資料集」,並選擇選項。如果您要撰寫自己的 SQL 陳述式,請按一下「進階」。

    確定「資料集」包含建立主要頁面所需要的所有表格欄。資料集也必須包括表格欄,其中含有各筆記錄的唯一索引鍵 -- 也就是記錄 ID 欄。在下列範例中,CODE 欄含有各筆記錄的唯一索引鍵。

    在主要頁面中選取的資料集欄
    在主要頁面中選取的資料集欄

    一般而言,主要頁面中的資料集會從資料庫表格中擷取為數不多的幾個資料欄,而細節頁面中的資料集則會從同一個資料庫表格中擷取更多的資料欄以提供更詳細的資訊。

    資料集可以由使用者在執行階段加以定義。如需詳細資訊,請參閱建立搜尋及結果頁面

  3. 插入動態表格以顯示記錄。

    請將插入點置於您要動態表格出現在頁面上的位置。選取「插入>資料物件>動態資料>動態表格」、設定選項,然後按一下「確定」。

    如果您不要讓使用者看見記錄 ID,可以從動態表格中刪除該欄位。請按一下頁面中的任何地方,將焦點移到頁面中。將游標移到動態表格中欄位頂端附近,等到欄位儲存格的外框變成紅色後,按一下選取這個欄位。按 Delete 鍵,從表格中刪除這個資料欄。

在建立主要頁面並新增資料集之後,請建立會開啟細節頁面的連結。然後修改連結以傳送使用者所選記錄的 ID。細節頁面會使用這個 ID 在資料庫中尋找要求的記錄,然後顯示它。

註解:

請使用相同程序建立對更新頁面的連結。結果頁面類似於主要頁面,而更新頁面則類似於細節頁面。

開啟細節頁面並傳遞記錄 ID (ColdFusion、PHP)

  1. 在動態表格中,為要當成連結的文字選取內容預留位置。
    連結會套用到選取的預留位置
    連結會套用到選取的預留位置。

  2. 在「屬性」檢視窗中,按一下「連結」方塊旁邊的資料夾圖示。
  3. 瀏覽並選取細節頁面。細節頁面會出現在「屬性」檢視窗的「連結」方塊中。

    在動態表格中,所選取文字便會顯示為已連結。當頁面在伺服器上執行時,連結會套用到每個表格列中的文字。

  4. 在主要頁面上,選取動態表格中的連結。
  5. (ColdFusion) 在「屬性」檢視窗的「連結」方塊中,將下列字串加在 URL 的結尾處:
    ?recordID=#recordsetName.fieldName#

    問號會告訴伺服器,後面接的是一或多個 URL 參數。recordID 是 URL 參數的名稱 (您可以依喜好命名)。記下 URL 參數的名稱,因為稍後會在細節頁面中用到它。

    等號後面的運算式是參數的值。在這種情況下,值是由會從資料集傳回記錄 ID 的 ColdFusion 運算式所產生的。動態表格中的每一列都會產生不同的 ID。在 ColdFusion 運算式中,請用資料集的名稱來取代 recordsetName,並以資料集中唯一識別各筆記錄的欄位名稱來取代 fieldName。大部分情況下,欄位會由記錄 ID 編號所構成。在下列範例中,欄位是由唯一位置碼所構成的。

    locationDetail.cfm?recordID=#rsLocations.CODE#

    頁面執行時,會將資料集的 CODE 欄位值插入動態表格的對應列中。例如,如果澳洲坎培拉 (租賃位置) 的代碼是 CBR,那麼便會在動態表格的「坎培拉」列中使用下列 URL:

    locationDetail.cfm?recordID=CBR
  6. 在「屬性」檢視窗的「連結」欄位中,將下列字串加在 URL 的結尾處:
    ?recordID=<?php echo $row_recordsetName['fieldName']; ?>

    問號會告訴伺服器,後面接的是一或多個 URL 參數。recordID 是 URL 參數的名稱 (您可以依喜好命名)。記下 URL 參數的名稱,因為稍後會在細節頁面中用到它。

    等號後面的運算式是參數的值。在這種情況下,值是由會從資料集傳回記錄 ID 的 PHP 運算式所產生的。動態表格中的每一列都會產生不同的 ID。在 PHP 運算式中,請用資料集的名稱來取代 recordsetName,再用資料集中可唯一識別各筆一記錄的欄位名稱來取代 fieldName。大部分情況下,欄位會由記錄 ID 編號所構成。在下列範例中,欄位是由唯一位置碼所構成的。

    locationDetail.php?recordID=<?php echo $row_rsLocations['CODE']; ?>

    頁面執行時,會將資料集的 CODE 欄位值插入動態表格的對應列中。例如,如果澳洲坎培拉 (租賃位置) 的代碼是 CBR,那麼便會在動態表格的「坎培拉」列中使用下列 URL:

    locationDetail.php?recordID=CBR
  7. 儲存頁面。

開啟細節頁面並傳遞記錄 ID (ASP)

  1. 選取要兼作連結的動態內容。
  2. 在「伺服器行為」面板 (「視窗 > 伺服器行為」) 中,按一下加號 (+) 按鈕,再從彈出式選單中選取「前往細節頁面」。
  3. 在「細節頁面」方塊中,按一下「瀏覽」以尋找頁面。
  4. 指定要傳送至細節頁面的值,方法是先選取一個資料集,然後從「資料集和欄」彈出式選單中選取資料欄。每一筆記錄通常都會有一個唯一的值,例如記錄的唯一索引鍵 ID。
  5. 您可以視情況需要,選取「URL 參數」或「表單參數」等選項,將現有的網頁參數傳送至細節頁面。
  6. 按一下「確定」。

    特殊的連結便會包圍選取的文字。當使用者按一下此連結時,「前往細節頁面」伺服器行為就會將含有記錄 ID 的 URL 參數傳送至細節頁面。例如,假設 URL 參數的名稱為 id,而細節頁面的名稱為 customerdetail.asp,則當使用者按下該連結時,URL 看起來會像下列這樣:

    http://www.mysite.com/customerdetail.asp?id=43

    URL 的第一個部分 http://www.mysite.com/customerdetail.asp,會開啟細節頁面; 而第二個部分的 ?id=43 則是一個 URL 參數。這個參數會告訴細節頁面所要尋找和顯示的記錄, 其中的 id 就是 URL 參數的名稱,而 43 則是這個參數的值。在這個範例中,URL 參數包含的記錄 ID 編號為 43。

尋找所要求的記錄,並將該筆記錄顯示於細節頁面

為了顯示主要頁面要求的記錄,您必須定義資料集以保存單一記錄,並將資料集欄繫結至細節頁面。

  1. 切換至細節頁面。如果您還沒有細節頁面,請建立空白頁面 (「檔案>開新檔案」)。
  2. 在「繫結」面板 (「視窗>繫結」) 中,按一下加號 (+) 按鈕,然後從彈出式選單中選取「資料集 (查詢)」。

    簡單「資料集」對話方塊便會出現。如果出現的是進階對話方塊,請按一下「簡單」。

  3. 命名該資料集,然後選取要為資料集提供資料的資料來源及資料庫表格。
  4. 在「欄」區域中,選取要包含在資料集中的表格欄。

    這個資料集可以和主要頁面上的資料集相同或不同。一般而言,細節頁面中的資料集會提供較多的資料欄,以顯示較詳細的資訊。

    如果是不同的資料集,請確定細節頁面上的資料集至少包含一個和主要頁面資料集共通的欄。共通的欄通常是記錄 ID 欄,但也可以是相關表格的結合欄位。

    若只想要將某些表格的資料欄納入資料集中,請按一下「已選取」,然後在清單中按 Control+按一下 (Windows) 或 Command+按一下 (Macintosh) 以選取您要的資料欄。

  5. 完成「篩選器」區段,以尋找並顯示主要頁面所傳送 URL 參數中指定的記錄:
    • 在「篩選器」區域的第一個彈出式選單中,選取資料集的欄,這個欄必須和主要頁面所傳送的 URL 參數值相符。例如,如果 URL 參數中含有記錄 ID 編號,則應選取含有記錄 ID 編號的欄。在前一節所討論的範例中,稱為 CODE 的資料集欄包含的值,與主要頁面所傳送的 URL 參數值相符。

    • 在第一個選單旁的彈出式選單中,選取等號 (系統應該已經自動選了等號)。

    • 在第三個彈出式選單中,選取「URL 參數」。主要頁面會使用 URL 參數將資訊傳送到細節頁面。

    • 在第四個方塊中,請輸入由主要頁面所傳送之 URL 參數的名稱。

  6. 按一下「確定」。資料集會在「繫結」面板中出現。
  7. 若要將資料集欄繫結至細節頁面,請選取「繫結」面板中的欄 (「視窗>繫結」),然後將它們拖曳到頁面中。

    在將主要及細節頁面上傳到伺服器之後,您可以在瀏覽器中開啟主要頁面。按一下主要頁面上的細節連結,便會開啟細節頁面,其中包含有關所選取記錄的詳細資訊。

尋找特定記錄並在頁面上顯示該資料 (ASP)

您可以新增會在資料集中尋找特定記錄的伺服器行為,以便在頁面上顯示記錄資料。只有在使用 ASP 伺服器模式時,才可以使用這個伺服器行為。

  1. 建立具有下列必要項目的頁面:
  2. 按一下「伺服器行為」面板 (「視窗 > 伺服器行為」) 上的加號 (+) 按鈕,再選取「資料集分頁 > 移到特定記錄」,可以新增伺服器行為來尋找 URL 參數所指定的記錄。
  3. 在「移到記錄來源」彈出式選單中,選取您為頁面所定義的資料集。
  4. 在「欄來源」彈出式選單中,選取含有由其他頁面所傳送值的欄。

    例如,當其他頁面傳送的是記錄 ID 編號時,就選取含有記錄 ID 編號的欄。

  5. 在「比對 URL 參數」方塊中,輸入由其他頁面所傳送的 URL 參數名稱。

    例如,如果其他頁面用來開啟細節頁面的 URL 是 id=43,則在「比對 URL 參數」方塊中輸入 id

  6. 按一下「確定」。

    下一次瀏覽器再要求該頁面時,伺服器行為就會讀取其他頁面所傳送 URL 參數中的記錄 ID,再移到資料集中指定的記錄。

在一次作業中建立主要和細節頁面

開發網路應用程式時,您可以使用「主要及細節頁面組」資料物件,快速建立主要和細節頁面。

  1. 若要建立空白動態頁面,請選取「檔案>開新檔案>空白頁面」、從「頁面類型」清單選取動態頁面,然後按一下「建立」。

    這個頁面便會成為主要頁面。

  2. 定義頁面的資料集。

    請確定該資料集中不只包含主要頁面所需的所有欄,同時也必須要包含細節頁面所需的所有欄。一般而言,主要頁面中的資料集會從資料庫表格中擷取為數不多的幾個資料欄,而細節頁面中的資料集則會從同一個資料庫表格中擷取更多的資料欄以提供更詳細的資訊。

  3. 在「設計」檢視中開啟主要頁面,然後選取「插入>資料物件>主要及細節頁面組」。
  4. 在「資料集」彈出式選單中,請確定已選取了含有要於主要頁面中顯示記錄的資料集。
  5. 在「主要頁面欄位」區域中,選取要顯示於主要頁面中的資料集欄。

    根據預設,會選取資料集中的所有欄。如果資料集中含有唯一索引鍵欄,像是 recordID,請選取該索引鍵欄,並按一下減號 (-) 按鈕,這個索引鍵欄便不會顯示在頁面上。

  6. 若要變更各欄在主要頁面中的顯示順序,請選取清單中的某欄,然後按一下向上或向下鍵來調整順序。

    在主要頁面中,資料集欄會以水平方式顯示於表格中; 因此當您按一下向上鍵時,會將直欄左移一個位置,而按一下向下鍵時,會將直欄右移一個位置。

  7. 在「連結到詳細資料來源」彈出式選單中,選取資料集中要在細節頁面顯示數值並做為連結的欄。

    例如,如果您要讓主要頁面中的每一個產品名稱,都有一個連至細節頁面的連結時,請選取含有產品名稱的資料集欄。

  8. 在「傳送唯一索引鍵」彈出式選單中,選取內含用來識別記錄之數值的資料集欄。

    通常會選擇的欄是記錄 ID 編號, 系統會將這個數值傳送至細節頁面,用來識別使用者所選取的記錄為何。

  9. 如果唯一索引鍵欄不是數值,請取消選取「數值」選項。

    註解:

    依預設值,會選取這個選項,但不見得所有的伺服器模式都必須沿用這個選項。

  10. 指定主要頁面中所要顯示的記錄數目。
  11. 在「細節頁面名稱」文字方塊中,按一下「瀏覽」尋找您所建立的細節頁面檔案,或者輸入名稱,直接讓資料物件建立這個細節頁面檔案。
  12. 在「細節頁面欄位」區域中,請選取要顯示於細節頁面中的欄。

    根據預設,會選取主要頁面資料集中的所有欄。如果資料集中含有唯一索引鍵欄,像是 recordID,請選取該索引鍵欄,並按一下減號 (-) 按鈕,這個索引鍵欄便不會顯示細節頁面上。

  13. 若要變更各欄在細節頁面中的顯示順序,請選取清單中的某欄,然後按一下向上或向下鍵來調整順序。

    在細節頁面中,資料集欄會以垂直方式顯示於表格中。按一下向上鍵會將欄上移一個位置,按一下向下鍵則會將欄下移一個位置。

  14. 按一下「確定」。

    資料物件會建立細節頁面 (如果您尚未建立細節頁面),並同時在主要頁面和細節頁面中加入動態內容和伺服器行為。

  15. 依照您的需求自訂主要和細節頁面的版面。

    您可以使用 Dreamweaver 網頁設計工具,完全自訂每個頁面的版面。您也可以在「伺服器行為」面板中的項目上按兩下,來編輯伺服器行為。

    在使用資料物件建立主要及細節頁面之後,請使用「伺服器行為」面板 (「視窗>伺服器行為」) 來修改資料物件插入頁面中的各種建置組塊。

此産品由 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 授權  Creative Commons 條款未涵蓋 Twitter™ 與 Facebook 文章。

法律說明   |   線上隱私權政策