# 公司筆記_Web.NET_1201 --- ###### tags: `.NET` `工作` `web form` 筆記內所有成就,皆不來自我 感謝所有願意分享知識可貴之人 ---- ## 目錄 - 網頁上基礎架構 - 控制項 > - 網頁與應用程式 > - 控制項在哪? > - 內建控制項與HTML控制項 > - 內建控制項與HTML控制項 差異 - PostBack屬性? > - 開始使用簡易範例 - OnClientClick屬性 - OnTextChanged屬性 - AutoPostBack屬性 - DropdownList > - Listitem - 補充 > - HTML按鈕使用PostBack > --- ## 網頁上基礎架構 (待補) ## 控制項 如何使用控制項?? 在webForm中可以使用拖拉的方式來排位置 但製作網頁時***不建議***用拖拉方式 網頁元素常常過多,所以並不適合使用拖拉 一般做網頁時多半使用HTML元素(HTML控制項也可以這兩個是一樣的) 應為網頁外觀都會用的很漂亮 所以web(網頁)基本上以外觀為主所以也不太使用內建控制項 --- 在同一webform表單上  windows內建控制項與HTML控制項 **可以混合使用** **標準控制項有些元素已經沒再使用** **標準控制項元素有些會對應HTML控制項元素** ### 網頁與應用程式 承上補充 假如客戶今天請工程師使用webform做了'美美的網頁'後 想轉成應用程式,是**沒辦法的** webForm.NET是使用 內建控制項 轉 應用程式 而且應用程式外觀需一致 ### 控制項在哪? 1. **紅框** 背景選項需在前端上(.aspx) 2. **黃框** 運行狀態需為停止(運行時顏色為橘色,停止時顏色為藍色) 3. **左邊工具箱**打開才會有東西(不然會全空空的)  ### 內建控制項與HTML控制項 標準為內建控制項 HTML為HTML控制項  **混合使用是可以的** `<asp` 為內建控制項 `<input` 為HTML控制項  ### 內建控制項與HTML控制項 差異 這時來運行吧!! 別忘了先重新建置 畫面上是兩個button 看起來沒差別  看 檢視網頁原始碼  詳細一點 紅色框是.NET後台做好產生的code 綠色框 不管是內建產生還是HTML控制產生其實原始碼是一樣的  ## PostBack 在之前先確認右上 '驗證的目標結構描述' 是否為HTML5  --- --- ### **開始使用簡易範例** **IsPostBack簡易範例** >> **內建控制項不需要改寫任何code就可與後端Page.Load掛勾** >> **HTML控制項需要修改code與後端Page.Load掛勾 開始偵錯模式後可以看到下圖 兩個button是前端.aspx程式 上方的String是後端.cs程式 run出來的  --- 後方.cs邏輯頁增加 圖中邏輯判斷 這段邏輯白話說明 當**不是** **'Post給自己PostBack'** 時 就進來if邏輯判斷式  這時按下 **內建控制項的按鈕後, 網頁上會只剩下'22'** **因為按下HTML按鈕沒有反應**  詳細程式運作流程 先在這三個地方下中斷點,運行程式 在第一次載入頁面時是顯示1122 程式運作為 1. 在if判斷(是否自己Post自己) 2. 否(if為非判斷,會進去) 3. 網頁上寫11 4. 網頁上寫22 **黃色小箭頭為程式正運作的地方** **F10可以至下一步**    --- **按下內建按鈕後** **再跑事件之前都會先跑Page.Load** 所以一樣進Page.Load 程式運作為 1. 在if判斷(是否自己Post自己) 2. 是(if為非判斷,不會進去) 3. 網頁上寫22    下圖function是在 **需要使用的控制項上面點兩下產生** 這邊是看運行過程(黃色箭頭),先Page.Load > 事件程式  ## OnClientClick屬性  --- OnClientClick為前端事件 **開始使用** 先在.aspx的內建控制項加上OnClientClick事件 ## OnTextChanged屬性 ## AutoPostback屬性 ## DropdownList ### Listitem
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up