1 / 40

WEB 伺服器控制項

WEB 伺服器控制項. WEB 伺服器控制項. ASP.NET 全新設計的元件 包含傳統的表單控制項 可以完全取代 HTML 控制項 基本 WEB 控制項、驗證控制項、清單控制項與豐富控制項 <asp:Literal id= “ XXX" runat="server"></asp:Literal>. 基本 WEB 伺服器控制項. HTML Server 控制項翻版. W EB 伺服器控制項 - TextBox. Single Line MultiLine Password

duke
Télécharger la présentation

WEB 伺服器控制項

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. WEB伺服器控制項

  2. WEB伺服器控制項 • ASP.NET全新設計的元件 • 包含傳統的表單控制項 • 可以完全取代HTML控制項 • 基本WEB控制項、驗證控制項、清單控制項與豐富控制項 • <asp:Literal id=“XXX" runat="server"></asp:Literal>

  3. 基本WEB伺服器控制項 HTML Server控制項翻版

  4. WEB伺服器控制項-TextBox • Single Line • MultiLine • Password • AutoPostBack屬性：只要有異動，自動Submit回Server(所有控制項都有) • EnableViewState屬性(所有控制項都有) True:submit後資料仍維持顯示在畫面上 False:submit後資料清除

  5. WEB伺服器控制項-TextBox

  6. 程式 畫面 WEB伺服器控制項-TextBox

  7. WEB伺服器控制項-TextBox

  8. WEB伺服器控制項-TextBox

  9. WEB伺服器控制項-TextBox

  10. WEB伺服器控制項-TextBox 輸入文字後按下Enter

  11. WEB伺服器控制項-Button • Button：一般按鈕 • LinkButton:長的像超連結 • ImageButton：利用圖片當按鈕 • 三者功能與用法相同，只是畫面呈現上的不同

  12. WEB伺服器控制項-Button

  13. WEB伺服器控制項-Button

  14. WEB伺服器控制項-Button 屬於Submit按鈕

  15. WEB伺服器控制項-Button

  16. WEB伺服器控制項-Button 利用BUTTON來傳遞值 CommandName與 CommandArgument屬性 一定要搭配Command事件做處理 屬於Command按鈕

  17. WEB伺服器控制項-Button

  18. WEB伺服器控制項-Button

  19. e 與 sender Sender as Object：表示觸發某事件的來源物件 E as EventArgs：表示傳遞給該事件的[額外描述]

  20. WEB伺服器控制項-Label • 多用來在「固定位置」顯示文字 • 操作Text屬性 • Literal Web Server控制項 (沒有<span>，無法使用CSS)

  21. WEB伺服器控制項-HyperLink • 以前的<a> </a>標籤 • 操作Text與NavigateURL屬性 • Text：畫面上顯示的文字 • NavigateURL：網址

  22. WEB Server Control • Table • Table  TableRow  TableCell • Table1.Rows(0).Cells(0).Text = "123“ • Table1.Rows(0).Cells(0).ForeColor = Color.Blue • Table1.Rows(0).Cells(0).Width = (New Unit).Pixel(23) 九九乘法表

  23. WEB Server Control－動態產生Table • .aspx中的form要刪除

  24. Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load '在這裡放置使用者程式碼以初始化網頁 Dim form1 As New HtmlForm form1.Method = "POST" form1.ID = "form1" form1.Name = "form1" Dim Tb As Table Dim Tr As TableRow Dim Tc As TableCell Dim chk As HtmlInputCheckBox Dim i As Integer Tb = New Table Tb.Width = (New Unit).Percentage(100) Tb.BorderWidth = (New Unit).Pixel(1) Tb.BorderColor = Color.Red Tb.CellSpacing = 0 Tb.CellPadding = 3 Tr = New TableRow Tc = New TableCell Tc.BorderWidth = (New Unit).Pixel(1) Tc.Width = (New Unit).Percentage(100) Tc.BorderColor = Color.Red

  25. For i = 1 To 10 Tr = New TableRow Tc = New TableCell Tc.BorderWidth = (New Unit).Pixel(1) Tc.Width = (New Unit).Percentage(100) Tc.BorderColor = Color.Red chk = New HtmlInputCheckBox chk.ID = "Chk_Del_" & i.ToString chk.Name = "Chk_Del_" & i.ToString chk.Attributes("onclick") = String.Format("Check_Del(''{0}'');", i.ToString) Tc.Controls.Add(chk) Tr.Cells.Add(Tc) Tb.Rows.Add(Tr) Next Tr = New TableRow Tc = New TableCell Tc.BorderWidth = (New Unit).Pixel(1) Tc.Width = (New Unit).Percentage(100) Tc.BorderColor = Color.Red form1.Controls.Add(Tb) Page.Controls.Add(form1) End Sub

  26. WEB Server Control－動態產生按鈕 Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load '在這裡放置使用者程式碼以初始化網頁 Dim mbutton As New WebControls.Button Panel1.Controls.Add(mbutton) mbutton.Text = "Click" AddHandler mbutton.Click, AddressOf button_click End Sub Private Sub button_click(ByVal sender As Object, ByVal e As EventArgs) Response.Write("aaaaaaaaTest") End Sub

  27. WEB Server Control－動態產生CHECKBOX Dim chk As CheckBox Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load chk = New CheckBox '產生checkbox chk.ID = "Chk_Del" chk.AutoPostBack = True chk.Text = "gggg" Panel1.Controls.Add(chk) '將form加入page AddHandler chk.CheckedChanged, AddressOf chk_click End Sub Private Sub chk_click(ByVal sender As Object, ByVal e As EventArgs) If chk.Checked Then Response.Write("aaaaaaaaTest") Else Response.Write("not ok") End If End Sub

  28. WEB Server Control－動態產生CHECKBOX陣列 Dim chk(5) As CheckBox Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load Dim i As Integer For i = 0 To 4 chk(i) = New CheckBox '產生checkbox chk(i).AutoPostBack = True chk(i).Text = i Panel1.Controls.Add(chk(i)) '將form加入page AddHandler chk(i).CheckedChanged, AddressOf chk_click Next End Sub Private Sub chk_click(ByVal sender As Object, ByVal e As EventArgs) Dim j As Integer For j = 0 To 4 If chk(j).Checked Then Response.Write("aaaaaaaaTest") Else Response.Write("not ok") End If Next End Sub

  29. 清單伺服器控制項

  30. WEB伺服器控制項- DropDownList • DropDownList1.SelectedItem.Text 取得使用者選取的文字 • DropDownList1.Item.Add(Text1.Text) 將內容加入DropDownList • 只能單選 • 先記住這個控制項具有DataSource屬性可與資料庫進行繫結

  31. WEB伺服器控制項-DropDownList

  32. WEB伺服器控制項- DropDownList

  33. WEB伺服器控制項- ListBox • 可以複選 • 功能與DropDownList控制項大同小異 • 有DataSource屬性

  34. WEB伺服器控制項- ListBox

  35. WEB伺服器控制項- ListBox • ListBox1.Items.Count Box中共有多少選項 • ListBox.Items(索引).Text 取出索引選項內的Text • ListBox.Items(索引).SelectedIndex  判斷是否被選取 • 這個控制項具有DataSource屬性可與資料庫進行繫結

  36. 豐富伺服器控制項

  37. WEB伺服器控制項- 日曆控制項 • 自動格式化

  38. WEB伺服器控制項- 日曆控制項 • 自動格式化

  39. WEB伺服器控制項- 日曆控制項

  40. WEB伺服器控制項- 日曆控制項 TextBox1.Text = Calendar1.SelectedDates.count TextBox1.Text = Calendar1.SelectedDates(0) 可以選取區間日期

More Related