本文轉自：http://blog.bossma.cn/asp_net_mvc/asp-net-mvc-htmlhelper-calendar-datetime-select/
這里我們擴展HtmlHelper，就像它包含在ASP.NET MVC中一樣，擴展方法使我們能為已有的類添加方法。這里使用了一個日期時間選擇控件：My97DatePicker，需要添加到網站中，並在頁面中引用。
先看看是怎么擴展的：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
using
System;
using
System.Collections.Generic;
using
System.Runtime.CompilerServices;
using
System.Linq.Expressions;
namespace
System.Web.Mvc
{
/// <summary>
/// Extended the HtmlHelper for Calendar
/// </summary>
public
static
class
CalendarExtensions
{
private
static
string
defaultFormat =
"yyyy-MM-dd"
;
/// <summary>
/// 使用特定的名稱生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="name">控件名稱</param>
/// <returns>Html文本</returns>
public
static
string
Calendar(
this
HtmlHelper helper,
string
name)
{
return
Calendar(helper, name, defaultFormat);
}
/// <summary>
/// 使用特定的名稱生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="name">控件名稱</param>
/// <param name="format">顯示格式</param>
/// <returns>Html文本</returns>
public
static
string
Calendar(
this
HtmlHelper helper,
string
name,
string
format)
{
return
GenerateHtml(name,
null
, format);
}
/// <summary>
/// 使用特定的名稱和初始值生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="name">控件名稱</param>
/// <param name="date">要顯示的日期時間</param>
/// <returns>Html文本</returns>
public
static
string
Calendar(
this
HtmlHelper helper,
string
name, DateTime date)
{
return
Calendar(helper, name, date, defaultFormat);
}
/// <summary>
/// 使用特定的名稱和初始值生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="name">控件名稱</param>
/// <param name="date">要顯示的日期時間</param>
/// <param name="format">顯示格式</param>
/// <returns>Html文本</returns>
public
static
string
Calendar(
this
HtmlHelper helper,
string
name, DateTime date,
string
format)
{
return
GenerateHtml(name, date, format);
}
/// <summary>
/// 通過lambda表達式生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="expression">lambda表達式，指定要顯示的屬性及其所屬對象</param>
/// <returns>Html文本</returns>
public
static
string
CalendarFor<TModel, TProperty>(
this
HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression)
{
return
CalendarFor(helper, expression, defaultFormat);
}
/// <summary>
/// 通過lambda表達式生成控件
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="expression">lambda表達式，指定要顯示的屬性及其所屬對象</param>
/// <param name="format">顯示格式</param>
/// <returns>Html文本</returns>
public
static
string
CalendarFor<TModel, TProperty>(
this
HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression,
string
format)
{
string
name = ExpressionHelper.GetExpressionText(expression);
DateTime value;
object
data = ModelMetadata.FromLambdaExpression<TModel, TProperty>(expression, helper.ViewData).Model;
if
(data !=
null
&& DateTime.TryParse(data.ToString(),
out
value))
{
return
GenerateHtml(name, value, format);
}
else
{
return
GenerateHtml(name,
null
, format);
}
}
/// <summary>
/// 通過lambda表達式獲取要顯示的日期時間
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="expression">lambda表達式，指定要顯示的屬性及其所屬對象</param>
/// <param name="format">顯示格式</param>
/// <returns>Html文本</returns>
public
static
string
CalendarDisplayFor<TModel, TProperty>(
this
HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression,
string
format)
{
string
name = ExpressionHelper.GetExpressionText(expression);
DateTime value;
object
data = ModelMetadata.FromLambdaExpression<TModel, TProperty>(expression, helper.ViewData).Model;
if
(data !=
null
&& DateTime.TryParse(data.ToString(),
out
value))
{
return
value.ToString(format);
}
else
{
return
string
.Empty;
}
}
/// <summary>
/// 通過lambda表達式獲取要顯示的日期時間
/// </summary>
/// <param name="helper">HtmlHelper對象</param>
/// <param name="expression">lambda表達式，指定要顯示的屬性及其所屬對象</param>
/// <returns>Html文本</returns>
public
static
string
CalendarDisplayFor<TModel, TProperty>(
this
HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression)
{
return
CalendarDisplayFor(helper, expression, defaultFormat);
}
/// <summary>
/// 生成輸入框的Html
/// </summary>
/// <param name="name">calendar的名稱</param>
/// <param name="date">calendar的值</param>
/// <returns>html文本</returns>
private
static
string
GenerateHtml(
string
name, DateTime? date,
string
format)
{
if
(date !=
null
)
{
return
"<input type=\"text\" id=\""
+ name +
"\" name=\""
+ name +
"\" onfocus=\"WdatePicker({dateFmt:'"
+ format +
"'})\" class=\"Wdate\" value=\""
+ date.Value.ToString(format) +
"\" />"
;
}
else
{
return
"<input type=\"text\" id=\""
+ name +
"\" name=\""
+ name +
"\" onfocus=\"WdatePicker({dateFmt:'"
+ format +
"'})\" class=\"Wdate\" value=\"\" />"
;
}
}
}
}
|
使用辦法：
日期選擇輸入框： <%= Html.CalendarFor(model => model.PlanStartTime)%>
顯示日期：<%= Html.CalendarDisplayFor(model => model.PlanStartTime)%>
日期時間選擇輸入框：<%= Html.CalendarFor(model => model.PlanStartTime, “yyyy-MM-dd HH:mm”)%>