asp.net 利用AjaxToolkit製作強行輸入HH:MM:SS的TextBox

2021-12-27

54
0
Asp.net

asp.net 利用AjaxToolkit製作強行輸入HH:MM:SS的方塊視窗

有時候會遇到使用者有只允許輸入時分秒的TextBox的需求

以下分享在網路上找到的解決方案

1. 先對專案案右鍵，"管理Nuget視窗"，搜尋"線上"，找尋"AjaxControlToolkit"，安裝最新穩定版20.x 以上

2.安裝完成後，記得檢查專案內web.config 與 packages.config 參數是否為當前安裝版本

</packages>

若版本未更新，請手動調整，或重新步驟2

3.建立Textbox Mask遮罩
<asp:TextBox ID="txtFilterRecordingTimeStart" runat="server" size="6" ></asp:TextBox>
<ajaxToolkit:MaskedEditExtender ID="txtFilterRecordingTimeStart_MaskedEditExtender" runat="server" TargetControlID="txtFilterRecordingTimeStart" MessageValidatorTip="true" MaskType="Time" Mask="99:99:99" UserTimeFormat="TwentyFourHour" AutoComplete="false" InputDirection="LeftToRight" ErrorTooltipEnabled="True" ClearTextOnInvalid="true" />

關鍵點在於屬性中的MaskType="TimeMask="99:99:99" 兩項設定

4.後端處理

由於純時間，所以此次改完全部轉為秒數，程式碼如下
int sec=Convert.ToInt32(TimeSpan.Parse(txtFilterRecordingTimeStart.Text).TotalSeconds);

5.更版注意事項
除須注意web.config 與 packages.config 參數外
也需更新bin\(Project).dll編譯檔案以及bin\AjaxControlToolkit.dll
才可順利運行

Good Luck

回首頁