Создание вспомогательного расширения
Теперь, когда мы создали средство выбора рабочей даты, давайте добавим его в метод расширения, чтобы очистить пользовательский интерфейс и позволить нам использовать его в другом месте.
Создайте новую папку в корневом каталоге проекта с именем «UI» и создайте новый класс с именем «HtmlHelperExtensions.cs» в нашей новой папке:
В новом классе добавьте к нему следующий метод (вам нужно добавить предложение using в System.Web.MVC & System.Text):
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;
using System.Web.Mvc;
namespace DatePickerHarness.UI
{
public static class HtmlHelperExtensions
{
public static string DatePicker(this HtmlHelper helper, string name, string imageUrl, object date)
{
StringBuilder html = new StringBuilder();
// Build our base input element
html.Append("<input type=\"text\" id=\"" + name + "\" name=\"" + name + "\"");
// Model Binding Support
if (date != null)
{
string dateValue = String.Empty;
if (date is DateTime? && ((DateTime)date) != DateTime.MinValue)
dateValue = ((DateTime)date).ToShortDateString();
else if (date is DateTime && (DateTime)date != DateTime.MinValue)
dateValue = ((DateTime)date).ToShortDateString();
else if (date is string)
dateValue = (string)date;
html.Append(" value=\"" + dateValue + "\"");
}
// We're hard-coding the width here, a better option would be to pass in html attributes and reflect through them
// here ( default to 75px width if no style attributes )
html.Append(" style=\"width: 75px;\" />");
// Now we call the datepicker function, passing in our options. Again, a future enhancement would be to
// pass in date options as a list of attributes ( min dates, day/month/year formats, etc. )
html.Append("<script type=\"text/javascript\">$(document).ready(function() { $('#" + name + "').datepicker({ showOn: 'button', buttonImage: '" + imageUrl + "', duration: 0 }); });</script>");
return html.ToString();
}
}
}
Чтобы добавить пространство имен, откройте ваш web.config (вы можете использовать web.config в папке 'View' или перейти в корень и добавить его туда) и добавить следующее в элемент namespaces:
<add namespace="YourProjectNameGoesHere.UI"/>
Теперь, когда мы получили это, мы можем получить доступ к методу расширения из нашего представления:
Теперь, когда у нас есть возможность вызывать наш метод расширения, давайте сделаем это немного более захватывающим и обернем все в форму, которая будет отправлена обратно в действие в нашем контроллере. Сначала нам нужно добавить нашу полную форму в веб-интерфейс:
<%= Html.DatePicker("Date", "/Content/images/calendar.gif", this.ViewData["TheDate"]) %>
URL ссылки