asp.net mvc4中bootstrap datetimepicker控制項的使用_實用技巧

前段時間寫了一篇關於調用阿里大於的簡訊介面來開發例會簡訊群發通知功能的文章http://www.jb51.net/article/94142.htm，其中的例會時間是需求中的重中之重，它需要滿足“格式化”，“易輸入”這兩點，對簡訊費用關心的開發人員要知道長簡訊是兩條簡訊費用之和，因此，例會時間不能隨意交給使用者自訂輸入；要考慮到“易輸入”這點，只能選擇日期選擇控制項來輔助使用者輸入，由於日期選擇控制項較為小巧使用，在頁面中引入並不是難事。在本篇文章中，使用的是bootstrap的datetimepicker控制項，如今bootstrap廣泛使用，加之項目裡用的也是bootstrap架構快速搭建介面的，這樣一來選擇這款日期控制項也能較省資源，在這裡呈上它的效果圖：

　　這裡想分享以下我在引入datetimepicker資源時遇到的一個問題解決方案，這裡你需要引入bootstrap-datetimepicker.css和bootstrap-datetimepicker.js，但是引入資源前，你需要在asp.net mvc 中的BundleConfig.cs稍作改變，要說明的是，這個日期控制項依賴jquery.js和bootstrap.js，這些資源引用有時要考慮有先後順序，應該先引用jquery.js再bootstrap.js便是bootstrap-datetimepicker.js。如果遇到控制項點擊無反應，可以使用Firefox瀏覽器在控制台查看頁面遇到的錯誤。

　　在引用完資源後，這裡對html結構不再說。要知道的在下載的控制項zip壓縮包裡，有樣本html，這很方便進行操作。現在解決了易輸入的需求，再之是格式化，好在這個日期控制項得到的日期時間已經是正常化的，但有一個問題，選擇的時間是英文的，是否需要漢化也是一個考慮的方向。

　　項目裡對時間要求的格式為如：10月04。這裡不考慮漢化，在後台代碼中對字串處理，得到預期的時間日期。這裡可以採用ajax提交選擇的日期。先在在action中做處理：

 public ActionResult SmsSendForMeeting(FormCollection Form) {  string Operator = Form["Operator"] ;//寄件者 string Department =Form["Department"] ;//部門名稱 string Time = Form["Time"].ToString();//設定的時間 //對日期進行處理 //日期格式："18 September 2016 - 08:30 pm" Time = sp.DateParse(Time);//調用日期處理函數  //省略其他無關代碼 return View(); } 

　　這裡用到了DateParse()方法，這是解決日期格式轉換的方法。這裡的思路就兩條，一個是將年份和空格去掉，一個便是將英文月份轉換為數字月份，也就是string的操作。

 public string DateParse(string Time) { //string Time = "19 January 2016 - 09:00 pm"; Time = Time.Replace(" ", "");//去除空格 string day = Time.Substring(0, 2) + "日";//取出“日” int c = Time.LastIndexOf(":") - 2; string DetailTime = Time.Substring(c);//具體到小時分鐘  int b = Time.LastIndexOf("201");//這裡不是2016 Time = Time.Remove(b); string month = Time.Remove(0, 2);//月份   switch (month) { case "January":  month = "1月";  break; case "February":  month = "2月";  break; case "March":  month = "3月";  break; case "April":  month = "4月";  break; case "May":  month = "5月";  break; case "June":  month = "6月";  break; case "July":  month = "7月";  break; case "August":  month = "8月";  break; case "September":  month = "9月";  break; case "October":  month = "10月";  break; case "November":  month = "11月";  break; case "December":  month = "12月";  break; } string DateTime = month + day + DetailTime;//得到->9月18日08：30pm  return DateTime; }

　　這裡就是用到的switch ()函數和string操作如substring、replace、indexof、remove等，處理的思路有許多，在這裡是從左至右處理字串。DateParse（）函數最後返回就是需要的10月4日，這樣就滿足了對例會簡訊日期“格式化”和“易輸入”的需求。如果我思路和方法有誤，懇請各位指正，虛心求教。

以上就是本文的全部內容，希望對大家的學習有所協助，也希望大家多多支援雲棲社區。