不廢話！ 奮鬥吧！ 成為獨當一面的.net工程師！(1) 撰寫你的第一支ASP .net程式

呼哈哈哈

拖了那麼久終於到今天了啊...

沒辦法

在家裡光是睡覺都不夠用了只能挑上班的空檔來寫這種東西

不管你們能不能接受我還是要這樣

這就是權力 也就是Power

誰叫這個逋辣葛的主人是我

當然你也可以在下面留一堆垃圾留言

然後我就會刪掉 爽

你留一次我就刪一次

點個滑鼠而已嘛 沒可能輸的啊

所以要乖哦




接著進入正題

雖然離前段只隔了兩三行

不過我中間掙扎了兩小時到底該怎麼寫第一步

不如就先打開vs2012吧

點選開始->所有程式-> Microsoft Visual Studio 2012 Express->VS Express for Web

在左上角選擇檔案->新網站

在左側選擇範本下的Visual C#

之後在中間選擇asp.net空網站

如圖示

檔案系統什麼的就先不管了 讓我們按下確定

就出現真的什麼都沒有的空介面了

接著看到左邊有個工具箱

滑鼠移上去點它一下

他會跑一下把工具箱裝起來

然後就出現工具箱例了

雖然現在什麼都沒有不過我們還是先在工具箱上方的迴紋針圖示點一下 把他固定在左側

釘好的話迴紋針會是往下插的

像這樣

現在最基本的好用的工具箱已經出現了

就來開始寫我們第一支簡單的程式

在右邊的方案總管地球符號的地方點一下右鍵選加入->加入新項目

之後選擇web

我們可以發現下面的檔名顯示的是Default.aspx

這是asp .net預設首頁的名稱

不過你也可以另外自己改

這之後有機會我們再談

之後按下新增

選擇Webform後點擊新增

 之後會出現一個Default.aspx的檔案

當然如果你沒練過的話你會完全看不懂

不過這沒有關係

看到下方 現在被選取的是原始碼

讓我們接著點選"設計"

結果你會發現那一堆看不懂的東西在設計裡面完全沒有東西

不過那堆東西不是沒有用

Visual Studio已經自動幫你產生了最低限度的html碼

你可以不用煩惱要怎樣從無到用生出來

雖然不難不過做多了也很煩人

接著我們先提一下幾個最常用的物件

Label:也就是標籤的意思，可以在裡面顯示文字
Textbox: 文字方塊，可以在裡面輸入文字，也可以拿來顯示文字
Button:按鈕，應該看了就懂了，不知道該怎麼做事就叫使用者點button就對了



接下來我們會看到右方的工具箱現在有了滿滿的東西

現在拉一個Label到畫面裡

拉到body的框框內

像這樣

然後左鍵點擊一下這個label

然後可以看到右下方的屬性

 在這裡有兩個比較重要的

一個是Text 這個代表他會顯示出來的文字

另一個是ID 這是這個label物件的編號

在這個例子裡 我們完全沒管他的話VS會照編號一個一個生出來

之後我們先把Text改為"你好!" 按Enter

然後我們會發現原本畫面裡Label1的地方變成"你好!"了

接著是ID 我們把ID改為"lblWelcome"

這個命名是有意思的 我們稍微提一下

lbl代表的是label

welcome代表的是這個label物件的用途

不過這沒有硬性規定

任何人都可以照自己或是公司的規定做

好了

現在在方案總管點擊一下default.aspx選取他

然後我們看上方在你常用瀏覽器的名稱跟Debug中間有個地球加視窗的圖示

就可以開啟瀏覽器檢視我們的網頁寫成怎樣了

點這裡

結果是這個樣子

現在我們完成第一步了

接著我們再加一點東西進去

回到visualstudio的編輯區塊

從右側的工具箱拉一個Textbox跟一個Button出來

完成會像是這個樣子

拉好後我們幫Textbox跟Button把ID跟Text換掉

首先先換Textbox 就是那個看起來可以在裡面打字的東西

左鍵點擊一下textbox 然後到右邊的屬性視窗

找到(ID)的屬性 把TextBox1改為txtName

這個地方我們打算拿來輸入姓名

他的text屬性我們先不動

Textbox的ID改為txtName

接著點擊編輯畫面內的Button

同樣在右邊屬性視窗

把text改為"確定"

再把(ID)改為btnConfirm

Button的ID改為btnConfirm Text改為確定

接下來 真的要寫程式了哦

我們回到編輯視窗

點擊兩下text被改為確定的button

會看到後端程式碼(Behind Code)

先不解釋其它程式碼

我們先看protected void btnConfirm_Click(object sender, EventArgs e)這行

這是VS自己產生的click事件

它將會執行大刮號內的所有程式

"{     } "...嗯 大刮號

接著我們來簡單寫一下吧

我們在protected void btnConfirm_Click的大刮號裡

加上下面這一行

lblWelcome.Text = "你好!" + txtName.Text;

我們來解釋一下這行程式碼

lblWelcom是一開始網頁上顯示你好的那個label

lblWelcom.Text則是我們一開始有在屬性用過的顯示文字

等於符號就是等於符號

"你好!"  也就是你好 不過我們要用" "把它刮起來 這樣VS才會認得它是你自己輸入的字串

+就是加...

然後txtName是我們輸入名字用的TextBox

而txtName.Text是輸入的文字

 最後的分號 "; " 代表的是這行程式結束

很重要 一定要打上去

我曾經為了一個忘記打的分號Debug了半天(這裡的半天代表24/2也就是12個小時)

所以用白話文來講

我們點擊確認後

我們的lblWelcome的文字會等於 你好! 加上 你輸入的名字

會講話就會寫程式了啊

工程師這麼好當你還在等什麼啊!!!

然後我們按儲存

也就是你在左上方可以看到的磁片符號

接著再按F5

直接對網頁編譯加上偵錯

可能會跳出一個無法偵錯的提示

請選擇修改webconfig檔以啟用偵錯

然後就會在網頁上出現了

文字是我自己加的 你自己做的沒有

現在你可以試著在textbox中打名字

按確定之後 原來的"你好!"

會變成"你好! XXX"

當然XXX是你輸入的名字

如果你真的叫XXX也當我沒說

所以我們第一支程式大概就到這裡結束了

你可能會大喊:只有寫一行程式算什麼教學啊!!!

沒錯...VS的目的就是讓你不用一直寫程式也可以輕鬆開發

孩子們...我們一起來學.net吧!!



啊忘了講如果只把網頁關掉是不會結束偵錯模式的

要回到vs裡面上方有個一紅色方塊點它停止

或按shift+F5讓他停止

後記...

今天真的是壓力非常大啊...

我剛才打網誌打到一半組長跑過來問我在幹嘛

嚇到我語無倫次了...

又餓又累又驚...

我想這已經比饑寒交迫還要慘了啊...

然後...下回休刊...(也許吧)