簡介:
         網路拍賣也是一個典型的網路資料庫的應用,基本上應該先有一個賣家上傳資料的網頁,除了商品資訊之外,也要有產品的照片;當然還要有讓買家瀏覽商品及下訂單的網頁。本範例將這些網拍的核心機制以最簡單的網路資料庫程式範例加以展示。
半成品專案
資料庫的建置
商品資料表

開啟一個新的ASP.NET空網站,建立SQL資料庫,第一張表是『商品表』欄位定義如下:

ID應該是一個自動編號的欄位,設定方式請參考我的行事曆單元,請記得設定此欄為主索引!

訂單資料表
接著建立一個『訂單』資料表,欄位定義如下:

此處的 ID也是一個自動編號的欄位,也是主索引鍵。但「商品ID」則是使用者選的商品,不是自動編號的哦!

建立圖檔目錄
上傳的商品圖檔在本範例中將集中放在一個目錄,以免與網頁檔混在一起,請在網站開啟一個名為"images"的目錄。

賣家上傳的網頁
接著請新增一個Web Form網頁,頁面設計如下:

最上方是一個 Image物件,準備顯示賣家上傳的商品照片,其次是一個 FileUpload及Button物件供賣家選圖檔上傳之用。
接著是讓賣家輸入商品資訊的介面,最下方則是顯示目前商品表內容的 GridView,一開始當然是空的(沒有商品)。

上傳照片的程式

上傳照片的特殊機制是使用上傳時間的時間刻度值(Now.Tick)取代原來檔名存入網站之前建立的"images"目錄。
這樣作的目的是避免上傳圖檔的原始名稱相同產生後圖蓋掉前圖的錯誤,而且圖檔的副檔名(如 jpg或 gif)必須保留,否則稍後瀏覽器會不知如何開啟這個圖檔。
最後我們必須讓上傳圖檔變成一個網址,設定給Image1物件,請注意此處上傳圖檔的路徑是依據電腦的實體磁碟路徑,所以必須使用Server.MapPath這個函數找到網站的磁碟實體位置(譬如C:\WebSite之類的),但是 Image1.ImageUrl 需要的是網址,必須使用"~/images/"這樣的寫法,就是表示本網站的 images子目錄內的圖檔,兩者一是對內,一是對外寫法不同

上傳商品資訊的程式

在此就是新增一筆資料到商品表,句型請參考之前SQL基本語法體驗單元。

買家瀏覽商品與訂購的網頁
新增一個Web Form,設計頁面如下:

最上面是一個Image1物件,用於顯示買家想看商品的照片,其下是一個顯示單一商品詳細資訊,以及輸入訂購資訊的表格。接著是顯示所有商品的資料表,為了讓使用者可以選取商品,我們必須設定GridView有選取的按鍵(如上圖所示)。
我們接著用一個GridView只顯示照片的名稱,事實上這個GridView應該設定為Visible=False,也就是隱藏,因為照片名稱在上傳時已經改為時間刻度,讓使用者看到檔名也沒意義,在此的用處是讓程式設定顯示於Image1的商品照片網址。
最下方是訂單表,當使用者下訂之後會看到這個表上顯示自己的訂單資訊。

選取商品的程式
買家首先會需要選取某一商品,看照片及詳細資訊,請雙按GridView1的選取按鍵寫程式如下:

選取GirdView上面的某一行之前的選取按鍵時就是讓此行變成被選取狀態,上述程式就是讓此行資料單獨顯示於網頁上方的表格。比較特別的是照片網址是讀自隱藏的GridView2。

下訂單訂購的程式

這部分就是新增一筆訂單的程式,完成後執行GridView3.DataBind,客戶就會看到結果了。