GridView 加入自動編號欄位

此範例是示範如何在 GridView 加入一個自動編號的欄位，以標示該資料列的編號。

首先在 GridView 第一欄加入一個 TemplateField，並在 TemplateField 的 ItemTemplate 加入一個 Label (ID=lblNo)，asxp 對應程式碼如下。

01	<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False"

02	DataKeyNames="Flag,ID" DataSourceID="SqlDataSource1" EmptyDataText="沒有資料錄可顯示。">

03

<Columns>

04	<asp:TemplateField HeaderText="序號">

05	<ItemTemplate>

06	<asp:Label ID="lblNo" runat="server" Text="Label"></asp:Label>

07	</ItemTemplate>

08	<ItemStyle Wrap="True" />

09	<HeaderStyle Wrap="False" />

10	</asp:TemplateField>

11

12	</Columns>

13	</asp:GridView>

然後在 GridView 的 RowDataBound 事件中，設定每一列的 lblNo 的 Text 屬性值為 RowIndex+1。

因為 RowIndex 起始編號為 0 ，故每列的自動編號為 RowIndex+1。

1	Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

2	Dim oLabel As Label

3	If e.Row.RowType = DataControlRowType.DataRow Then

4	oLabel = CType(e.Row.Cells(0).FindControl("lblNo"), Label)

5	oLabel.Text = (e.Row.RowIndex + 1).ToString()

6

End If

7

End Sub

以上的寫法遇到 GridView 分頁時，都是由 1 開始編號，若需分頁需要接續編號，可改用修改如下。

view source

print?

01	Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound

02	Dim oLabel As Label

03	Dim oGridView As GridView

04

05	If e.Row.RowType = DataControlRowType.DataRow Then

06	oGridView = CType(sender, GridView)

07	oLabel = CType(e.Row.Cells(0).FindControl("lblNo"), Label)

08	oLabel.Text = (oGridView.PageIndex * oGridView.PageSize) + (e.Row.RowIndex + 1).ToString()

09

End If

10

End Sub

File Uploader 大檔案拖曳上傳控制項

想要在您的 Silverlight 和 ASP.NET 頁面上加入『大檔案拖曳上傳』的功能，並在上傳時顯示即時的上傳進度嗎?

在上個月的Visual Studio 2010上市發表會當中，我概略的展示了Silverlight 4的一些新功能，其中我個人最喜歡的範例就是大檔案的拖曳上傳(就是把file從檔案總管中拖曳到瀏覽器中並直接上傳，同時顯示該檔案的真實上傳進度)。

這個功能早在ASP.NET 2.0時代，我們就嘗試透過AJAX來開發過(當然當時只能做大檔案上傳，還沒有拖曳功能)，在坊間許多文管系統當中(最典型的就是MOSS)，這個功能也都是相當重要的需求之一。但礙於當時技術的限制，過去多半的解決方案都是在用戶端安裝特殊的ActiveX元件來處理。一來這衍生出安全性問題，二來也不是每一個用戶端都能夠順利或無條件的安裝ActiveX元件，再加上許多ASP.NET開發人員對於ActiveX元件的開發可能相當陌生，造成開發人員很大的困擾。

在Silverlight 4出現之後，我就一直很想把這個功能作一些整合，因此才有在VS2010上市發表會中的那個範例。但畢竟整個上傳動作涉及前後端的交互運作，前端是Silverlight 4，後端是ASP.NET應用程式，要開發人員從頭到尾重新建立這樣的功能實屬不易。

也因此，趁記憶猶新，我把拖曳大檔案上傳的功能整理成可在Silverlight 4或ASP.NET應用程式當中可重複使用的控制項，提供給需要的開發人員直接使用。 

• 相關的套件FileUploader檔案(Binaries & Examples)下載位置可參考[這裡]。 (範例包含Silverlight與ASP.NET)
• 在ASP.NET 2.0~4.0應用程式中的直接使用方式之說明文件可參考[這裡]。 (是的，在ASP.NET當中也可以直接使用，開發人員不一定需要會Silverlight)
• 在Silvelright 4應用程式當中的使用方式之說明文件可參考[這裡]。

底下是簡單的測試畫面展示，希望對各位有幫助。
 

介紹幾套好用的檔案上傳元件

檔案上傳幾乎每個專案都用的到，但 ASP.NET 2.0 的 FileUpload 控制項有點太陽春了，目前我從網路上找到的 File Upload 元件大多是透過 JavaScript + IFRAME 上傳，或用 JavaScript + Flash 上傳比較好用，今天介紹幾款不錯的。

1. SWFUpload
   
   採用 JavaScript + Flash 進行上傳動作，功能強大、一應俱全，雖然每有 ASP.NET 現成的控制項可用，但是有提供使用 ASP.NET 的範例可以參考，是個值得推薦使用的套件！
   
   其功能有：
   
   - 可一次上傳多個檔案。
   - 支援 JavaScript 的 Callback 事件。
   - 可在檔案開始上傳前取得部分檔案資訊。
   - 可以透過 XHTML 與 CSS 客製化上傳的元件。
   - 可得知檔案上傳進度。
   - 上傳檔案不需要 PostBack，可以等上傳檔案完成後再 PostBack 出去。
   - 只要是 Flash 支援的 Browser 都可以用。
   - 就算 Flash 或 JavaScript 都無效的時候，也可以正常上傳。
   - 可以在「檔案上傳之前」就先判斷檔案大小，超過限制可以不進行上傳。
   - 可以在瀏覽檔案時篩選特定的檔案類型
   - 支援上傳檔案佇列功能，可以在還沒上傳檔案之前將新增要上傳的檔案或移除要上傳的檔案。
   
2. FancyUpload
   
   這個套件就像他的名字一樣很花俏(Fancy)，看過他的 Demo 就是到他的威力了。
   
   其功能有：
   
   - 可一次上傳多個檔案。
   - 可以在瀏覽檔案時篩選特定的檔案類型
   - 支援 JavaScript 的 Callback 事件。
   - 可在檔案開始上傳前取得部分檔案資訊。
   - 可以在「檔案上傳之前」就先判斷檔案大小，超過限制可以不進行上傳，也可限制上傳檔案數的上限。
   - 只要是支援 Flash 8 的 Browser 都可以用。
   - 支援上傳檔案佇列功能，可以在還沒上傳檔案之前將新增要上傳的檔案或移除要上傳的檔案。
   - 所有功能都可以設定，文件
   - 可得知檔案上傳進度。
   - 上傳檔案不需要 PostBack，可以等上傳檔案完成後再 PostBack 出去。
   - 就算 Flash 或 JavaScript 都無效的時候，也可以正常上傳。
   
3. AjaxFileUpload
   
   這是一個 jQuery Plugin，也算是不錯用，只是功能沒像上面兩個那麼多功能，因為這套是用 JavaScript + IFRAME 的技巧實做的。
   
   如果你想找其他 jQuery Plugins 可以來這裡：http://plugins.jquery.com/