023同頁面有幾筆資料

　　先在頁面加入一個GridView, 然後第頁面上加入一行字，並放進一個Label。

上面的程式碼寫在「Page_Load」裡即可。

012自己打程式碼連結資料庫

雖然前面已說過如何連結資料庫，但之前的範例中，資料庫與資料表同名，會讓人搞不清連結資料庫的程式碼中，哪些是連資料庫，哪些是連資料表。

　　這個範例說明一個資料庫中，包含許多資料表。如上圖，資料庫名稱為「004eqesG403_2017」，其中包含許多資料表。本例中所要連結的資料表是「Comp003」。

　　在空白頁上接入一個GridView，它的ID為「GridView1」。接下來，不用「SqlDataSource」，直接在「Page_Load」中打程式碼連資料庫，讓網頁一開啟就載入資料表。

　　如上圖，上列三行要先自己打上去，接下來的程式才可執行（這應該是類別庫一類的吧！）。

　　跳到「Page_Load」，開始打程式碼囉!

　　首先要做的事是連入資料庫，程式碼為：

SqlConnection kk = new SqlConnection(WebConfigurationManager.ConnectionStrings[“” ].ConnectionString);

　　引號中的字串，要看「web.config」檔案。

　　

　　這裡有許多資料庫，本範例要連的是紅框處的資料庫，可參照第一張圖。這裡要注意的是，在「SQL Managerment Studio」中，資料庫是「004eqesG403_2017」，但連接字串要加上後面那一串，形成「004eqesG403_2017ConnectionString」這麼一長串。這個字串複製起來，直接貼到程式碼中。

　　上圖就是連資料庫的寫法。

　　這個範例的重點來了，跟上一次的例子不同的是，這裡連的資料「表」名稱不同於資料庫的名稱，所以在寫程式時，到這裡要寫對資料表。參考第一張圖。

021GridView排序設定

上面的表單，在日期排序方面，把比較新的資料放到下面去了，這樣在瀏覽資料時，一開始看到的都是舊資料，想看最新的資料必須按「日期」選項才能倒過來看到最新的，這是很不理想的狀態。解決方法如下：

重新設定資料來源。

因為之前設設定SqlDataSource時，這裡沒設定，所以排序預設正用「遞增」的方式。現在重新設定這個選項。

因為排序的依據是日期，故這裡選擇「stu_data」。

改成「遞減」排序。

到這裡應該會跳出一個視窗，詢問要不要重新整理資料結構？選擇「不」。然後下一步就完成了。來看結果：

　　果然把最新日期的資料放到最上面了。

020CheckBoxList「全選」與「取消全選」程式設計

　　有時我們需要快速全選所有選項，這個程式怎麼寫?不囉唆，看下面的例子:

　　畫面上兩個CheckBoxList，第二個才是主要的選單；第一個只放一個選項，然後，放一個Button，程式寫在這個按鈕上。程式碼很簡單，如下:

　　當CheckBoxList1的選項被勾了，則CheckBoxList2就進入迴圈。

　　操作方法是先勾選CheckBoxList1的選項，再按「選擇」按鈕。

019作業清點系統V.1.0實作

　　首先把資料表做好，如下：

　　這個資料表很簡單，流水號(id)之外，「stu_date」是資料輸入的日期，這欄位的資料由系統直接截取當天日期(程式碼為

TextBox2.Text = DateTime.Now.ToString();

「stu_subject」是科目;接下來的三欄分別是未完成作業的學生、已完成的學生，以及最後日期註解欄位。

　　接下來是網站規劃。預計設定三個頁面：

（１）       展示頁，取名「homewordCkShow.aspx」。

這個頁面用來展示每日清點的結果。該頁面不設權限控管，故在最外層，與「login」頁面同一層。此外，該頁面做兩個按鈕連結，一個是「總表編輯」，一個是「清點作業」。

這個頁面相對單純，只用一個GridView展示。其中有三個欄位要轉成樣板，並做好細部修改。(樣板的重新繫結在此不贅述，參考其他章節)

因為這個頁面相對單純，沒什麼程式碼要特別講的，就這樣吧！

以下是該頁面的畫面設計：

（２）作業清點頁面，取名「homeworkCK.aspx」。

這是最複雜的一個頁面了，程式相對也多。先看畫面：

這裡用到了兩個「Panel」。「Panel1」裡放兩個「CheckBoxList」，以「互相搬移」的程式做清點座號的基礎，相關程式設計概念請看前一章節。不過為了詳述，在此仍列出相關程式如下：

移至已交區按鈕的程式截圖如下：

String[] itemA:這是設一個字串陣列。等號右邊是說這個陣列的大小不能超過「CheckBoxList1」裡項目的總數。

接下來是一個回圈，用來把「CheckBoxlist1」裡被選到的項目丟到兩個地方，一個是字串陣列「itemA」;另一個是「CheckBoxList2」。

　　第二個回圈則是把「CheckBoxList1」裡剛才被選到的項目(item)從「CheckBoxList1」裡移除。要注意的是這裡使用的是對照itmeA裡被填進去的項目。

送回未交區按鈕的程式截圖如下：

跟上一個類似，不多說。

不過，由於一開始先將「CheckBoxList2」區域的兩個按鈕都設了「enabled = false」(在「Page_Load」裡先設定了!)，要等到「CheckBoxList1」的資料「送出」後才打開這一區的兩個按鈕(「送回未交於」及「清點完成」兩個按鈕)。這時如果將資料反向送回未交區，會導致該區兩個按鈕同時失去作用，故在此加上打開的程式碼如下:

打開當然不該是無條件的，如果「CheckBoxList2」裡沒東西，就不用送回，因此這兩個按鈕要保持「不能動」的狀態；反之，則打開。

接下來，我們來看看執行的結果，應該會像下面的圖：

這裡故意留下一個號碼放在「CheckBoxList1」裡。如果這是清點的結果，再來應該是按下「清點完成」按鈕，並將相關資料送交「Panel2」裡的暫存區，同時「Panel1」要關閉，才不會產生干擾。

「Panel2」裡的畫面設計如下:

　　日期欄位的資料直接截取當日的日期，程式碼為:

TextBox2.Text = DateTime.Now.ToString();

其他各欄位的資料都由「Panel1」裡的各欄位依序產生，這些相關的程式碼都寫在「Panel1」裡的最後一個按鈕à「清點完成」。

清點完成按鈕的程式碼如下：

　　如果CheckBoxList1裡的選項全都送到CheckBoxList2，表示所有學生都交作業了，這時，在TextBox3裡(未交學生區)就直接顯示「全部完成」;如果有未交的學生，則進到「if…」程式裡的「else」區。其他的就不多作解釋了。

　　此外，如果點完才發現還有調整的空間呢？有了這層考量，所以又增加了一個「微調」按鈕，程式碼如下：

　　基本上就是把「Panel1」打開，把「Panel2」關閉，同時把「Panel1」裡的所有按鈕打開(enabled = true)，把兩個CheckBoxList打開，同時把「Panel2」裡的所有TextBox資料清空。

　　如果發現需要重新清點呢？我在這裡設了一個全部重來的按鈕，程式碼如下：

　　很簡單的一行程式碼，其實只是讓網頁重新載入到最初的狀態而已。

　　此外，考量到如果很快可以判斷全班都交了，一個一個點太累了，因此加了一個按鈕，叫作「全選用前置按鈕」，它的使用方法是先選第一個選項，再按這個按鈕，那麼CheckBoxList1裡的所有選項就會同時被勾選。程式碼如下:

　　到目前為止，都是清點的前置作業，這些資料都還沒進到資料表中。當一切都確認了後，就是把資料寫入資料表裡的時候了。這跟之前網誌「008自訂新增文章頁面」裡介紹的一樣。首先，拉進一個「SqlDataSource」，設定資料來源，指向相關資料表，並進到「進階」，產生insert陳述式。如下圖所示：

　　點「SqlDataSource1」，並切換到「原始檔」，如下圖：

「Delete」跟「Update」用不到，可以註解掉(不理它們也無妨)；重點是「InsertParameters」標籤保留。切換回「設計」，看畫面右邊欄位，找到「InsertQuery(查詢)」，點右側的小方塊：

用「control」方式，指定好每個欄位的相應位置：

　　最後，把插入資料的程式碼寫在「確認，儲存」按鈕：

　　程式碼如下：

　　資料寫入資料庫的同時，網頁也重新載入，這樣一來所有表單就都清除了。

　　到這裡，清點系統最複雜的部份就搞定了！

(註:此外，還有核取方塊太小要解決的問題，參看之前章節，有決解方法)

（３）編輯頁面，取名「homeworkED.aspx」。

　　這裡就不多說明，因為都是之前章節介紹過的，只設概念。

　　清點作業完成後，資料表裡新增了一筆資料。可以在最外層的總表頁面查看。如果想對表中的資料做修改，例如原本沒交作業的學生把作業完成了，就要針對每一筆資料作修改，這時就可以進到這一頁來處理。

　　進到這一頁後，我的想法是用兩個「GridView」放在兩個Panel裡。第一個GridView展示用，並開啟排序，這樣才能找到最新一筆資料(目前還沒找到讓資料表反向排序的設定，可能要自己寫程式，目前還沒這功力…)。如果要修改某一筆資料，則按「選取」，這時兩個Panel的開關就互換了。

　　以上做法很基本，前面章節有。只是在做這一頁時，發現Panel2裡的GridView2編輯完後，會跳回Panel1的GridView1，雖然資料已改，但呈現的是上一頁的畫面。解決方法是在「GridView2」的「RowEditing」及「RowUpdating」事件上寫下兩個Panel的開關，如下圖示：

018兩個CheckBoxList互相搬移

在寫作業清點的程式之前，先來看看兩個CheckBoxList如何互相搬移它們的內容。以下圖解:

　　先來看看基本的畫面設計。這裡用到了兩個CheckBoxList，內容是把第一個用「編輯項目」的方式，加進所需的號碼；第二個CheckBoxList則不用編輯項目，讓它保持空白即可(因為它的內容來自第一個CheckBoxList）

　　接下來看看Button1的程式，如下:

　　這裡用到上一次練習到的一維字串陣列。主要是把移除的項目暫存到陣列中，再寫一個程式把它們正式從CheckBoxList1中移除。接下來，CheckBoxList2的程式也差不多。

　　這裡特別解釋一下，我們設了一個字串陣列，叫作「itemA[]」，其中，[]裡面要放的是數字，表示這個字串陣列的長度。當然，這裡左邊保持空白，由右邊來控制。至於右邊怎麼定義這個字串陣列的長度?用的是「CheckBoxList1.Items.Count」。

　　從以前學過的，我們知道要計算CheckBoxList這一從物件的內容數，使用的是「Count」。然而，在計算陣列長度時，用的不是「Count」，而是「Length」，如上圖解 。

　　第一個迴圈，程式碼：

for(int i = 0; i < itemA.Length; i++)

為什麼用的是「itemA.Length」，而不是「CheckBoxList1.Count」?因為這裡要計算的，是「被選取然後丟到字串陣列"itemA[]"裡的CheckBoxList1裡的項目。重點是「被選取後丟過去」的項目，故要計算的是在陣列中的東西，而不是更早一步處理的CheckBoxList1。

CheckBoxList2.Items.Add(CheckBoxList1.Items[i].Text);

這一段好理解，基本上就是把選取的CheckBoxList1項目丟到CheckBoxList2裡。
　　接下來是把剛才選取的CheckBoxList1的項目也丟到陣列itemA裡，程式碼為:

itmeA[a] = CheckBoxList1.Item[i].Text;

因為一開始設一個「int a = 0;」故進入迴圈第一次執行，是itemA[0]會拿到第一個被選取的CheckBoxList1.Item[0].Text。當執行第二次迴圈時，如果不加入程式碼「a = a + 1」，陣列會停在itemA[0]，就錯誤啦!故要加一個「a = a + 1」。
　　剩下的都簡單容易理解，就不多解釋了!

　　以上是執行結果。

　　此外，如果覺得核取方塊太小，可以再往前看看之前介紹過的解決方法。