2018年7月5日 星期四

ASP.NET (Web Form)整理-02 HTML送出表單按鈕 submit

ASP.NET (Web Form)整理-02 HTML送出表單按鈕 submit
HTML送出表單按鈕 submit




送出表單按鈕語法的關鍵在『input type="submit"』這裡,與之前介紹的普通按鈕有所差異
(參閱:顯示表單按鈕 button),設計師要怎麼分辨 submit 以及 button 的使用時機呢?很簡單,
送出表單按鈕顧名思義就是用來將表單資料送出的功能,所以當網友填寫完表單內容,
需要送出表的時候所使用的按鈕,就是 submit,而表單內的其他互動功能,則採用 button。

送出表單按鈕 submit 語法


<input type="submit" name="按鈕名稱" value="按鈕值" style="按鈕樣式">
語法中『input type="submit"』就是宣告此為送出表單用的按鈕,瀏覽器會根據這樣的宣告,
讓網友在填寫完表單內容並送出後,將資料自動傳遞至 <form> 所設定的接收程式,關於 <form>
基本語法及後端接收程式設定方式,請參閱此篇:HTML Form 表單設計

送出表單按鈕 submit 範例
<form action="result.php" method="post">
姓名:<input type="text" name="UserName"> <input type="submit" name="SB" value="送出表單">
</form>
呈現結果
姓名: 

整個範例用 <form></form> 標籤包起來,這個 <form> 標籤就是 HTML 的表單語法,先解釋一下
<form> 內的兩個重要參數,action 用來設定接收程式,method 則是資料傳遞的方式,
有了這樣的基本概念,就可以接著看 <form> 裡面的東西,其中『input type="text"』
是文字輸入欄位,『input type="submit"』就是今天的主角,表單送出按鈕,
我們給了這個按鈕一個名子叫做 SB,所以當網友送出表單之後,
後端的 result.php 程式就會接收到網友填寫在 name="UserName" 文字欄位內的資料
以及按鈕 SB 的值,而 submit 的 value="送出表單",所以 result.php 接收到的值
就會是"送出表單"這樣,設計師可以自己更改 submit 的 value。



沒有留言:

張貼留言