Asp.net mvc 4 @使用TagBuilder的带引导日期选择器的Html.datepicker

因此，我尝试为引导日期选择器添加一个扩展：

 public static MvcHtmlString DatePickerFor<TModel, TValue>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>> expression)
    {
        var propertyName = ExpressionHelper.GetExpressionText(expression);
        var controlGroupWrapper = new TagBuilder("div");
        controlGroupWrapper.AddCssClass("control-group");

        controlGroupWrapper.InnerHtml += htmlHelper.LabelFor(expression, new Dictionary<string, object> { { "class", "control-label" } }).ToHtmlString();

        var controlWrapper = new TagBuilder("div");
        controlWrapper.AddCssClass("controls");

        var datePicker = new TagBuilder("div");
        datePicker.AddCssClass("input-append date datepicker");
        datePicker.MergeAttribute("data-date-format", "dd/mm/yyy");

        var addOnWrapper = new TagBuilder("span");
        addOnWrapper.AddCssClass("add-on");

        var iconThWrapper = new TagBuilder("i");
        iconThWrapper.AddCssClass("icon-th");

        addOnWrapper.InnerHtml += iconThWrapper.ToString(TagRenderMode.Normal);



        var value = GetPropValue(htmlHelper.ViewData.Model, propertyName);
        var innerHtml = htmlHelper.EditorFor(expression).ToHtmlString();
        innerHtml += addOnWrapper.ToString(TagRenderMode.Normal);

        var datepickerInnerHtml = datePicker.ToString(TagRenderMode.Normal);
        datepickerInnerHtml += innerHtml;

        controlWrapper.InnerHtml += datepickerInnerHtml;

        controlGroupWrapper.InnerHtml += controlWrapper.ToString(TagRenderMode.Normal);



        return MvcHtmlString.Create(controlGroupWrapper.ToString(TagRenderMode.Normal));

    }

public static MvcHtmlString日期选择器（此HtmlHelper HtmlHelper，表达式）
{
var propertyName=ExpressionHelper.GetExpressionText（表达式）；
var controlGroupWrapper=新标记生成器（“div”）；
controlGroupWrapper.AddCssClass（“控制组”）；
controlGroupWrapper.InnerHtml+=htmlHelper.LabelFor（表达式，新字典{{“类”，“控件标签”}）.ToHtmlString（）；
var controlWrapper=新标记生成器（“div”）；
controlWrapper.AddCssClass（“控件”）；
var datePicker=新标记生成器（“div”）；
datePicker.AddCssClass（“输入附加日期日期选择器”）；
datePicker.MergeAttribute（“数据日期格式”，“dd/mm/yyy”）；
var addOnWrapper=新标记生成器（“span”）；
addOnWrapper.AddCssClass（“附加组件”）；
var iconThWrapper=新标记生成器（“i”）；
iconThWrapper.AddCssClass（“icon th”）；
addOnWrapper.InnerHtml+=iconThWrapper.ToString（TagRenderMode.Normal）；
var value=GetPropValue（htmlHelper.ViewData.Model，propertyName）；
var innerHtml=htmlHelper.EditorFor（expression.ToHtmlString（）；
innerHtml+=addOnWrapper.ToString（TagRenderMode.Normal）；
var datepickerinerHTML=datePicker.ToString（TagRenderMode.Normal）；
DatePickerinerHTML+=内部HTML；
controlWrapper.InnerHtml+=datepickerInnerHtml；
controlGroupWrapper.InnerHtml+=controlWrapper.ToString（TagRenderMode.Normal）；
返回MvcHtmlString.Create（controlGroupWrapper.ToString（TagRenderMode.Normal））；
}

这就是我所拥有的，我需要的是：

 <div class="control-group">
            <label class="control-label" for="Date">@Model.DisplayName</label>
            <div class="controls">
                <div class="input-append date datepicker" data-date-format="dd/mm/yyyy">
                  <input name="@Model.Name" value="@Model.Value" class="span2" type="text"/>
                    <span class="add-on"><i class="icon-th"></i></span>
                </div>
            </div>
        </div>

@Model.DisplayName

我在屏幕上看到的是：

<div class="control-group">
    <label class="control-label" for="StartDate_Value">Value</label>
    <div class="controls">
        <div class="input-append date datepicker" data-date-format="dd/mm/yyy">
        <div class="datepicker datepicker-inline" style="display: block;">
            <div class="datepicker-days" style="display: block;">
                <table class=" table-condensed">
                    <thead>
            div>
        </div>
    </div>
    <input class="text-box single-line" id="StartDate_Value" name="StartDate.Value" type="text" value="">
    <span class="add-on">
        <i class="icon-th"></i>
    </span>
</div>

价值
div>

---

正如你所看到的，这些东西并没有排列好，我在屏幕上得到的是实际的日期选择器div，而不是通过JS插入的。有人知道我做错了什么吗？

对于那些试图编写自己的@Html.DatePickerFor（）的人，以下是我为让它工作所做的

 public static MvcHtmlString DatePickerFor<TModel, TValue>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>> expression)
    {
        var propertyName = ExpressionHelper.GetExpressionText(expression);
        var controlGroupWrapper = new TagBuilder("div");
        controlGroupWrapper.AddCssClass("control-group");

        controlGroupWrapper.InnerHtml += htmlHelper.LabelFor(expression, new Dictionary<string, object> { { "class", "control-label" } }).ToHtmlString();

        var controlWrapper = new TagBuilder("div");
        controlWrapper.AddCssClass("controls");

        var datePicker = new TagBuilder("div");
        datePicker.AddCssClass("input-append date datepicker");
        datePicker.MergeAttribute("data-date-format", "dd/mm/yyy");

        var spanWrapper = new TagBuilder("span");
        spanWrapper.AddCssClass("add-on");

        var iconThWrapper = new TagBuilder("i");
        iconThWrapper.AddCssClass("icon-th");

        GetPropValue(htmlHelper.ViewData.Model, propertyName);
        var inputTag = htmlHelper.EditorFor(expression).ToHtmlString();


        spanWrapper.InnerHtml += iconThWrapper.ToString(TagRenderMode.Normal);


        datePicker.ToString(TagRenderMode.Normal);
        datePicker.InnerHtml += inputTag + spanWrapper.ToString(TagRenderMode.Normal); ; 

        controlWrapper.InnerHtml += datePicker.ToString(TagRenderMode.Normal);

        controlGroupWrapper.InnerHtml += controlWrapper.ToString(TagRenderMode.Normal);



        return MvcHtmlString.Create(controlGroupWrapper.ToString(TagRenderMode.Normal));

    }

public static MvcHtmlString日期选择器（此HtmlHelper HtmlHelper，表达式）
{
var propertyName=ExpressionHelper.GetExpressionText（表达式）；
var controlGroupWrapper=新标记生成器（“div”）；
controlGroupWrapper.AddCssClass（“控制组”）；
controlGroupWrapper.InnerHtml+=htmlHelper.LabelFor（表达式，新字典{{“类”，“控件标签”}）.ToHtmlString（）；
var controlWrapper=新标记生成器（“div”）；
controlWrapper.AddCssClass（“控件”）；
var datePicker=新标记生成器（“div”）；
datePicker.AddCssClass（“输入附加日期日期选择器”）；
datePicker.MergeAttribute（“数据日期格式”，“dd/mm/yyy”）；
var spanWrapper=新标记生成器（“span”）；
spanWrapper.AddCssClass（“附加组件”）；
var iconThWrapper=新标记生成器（“i”）；
iconThWrapper.AddCssClass（“icon th”）；
GetPropValue（htmlHelper.ViewData.Model，propertyName）；
var inputTag=htmlhelp.EditorFor（expression.ToHtmlString（）；
spanWrapper.InnerHtml+=iconThWrapper.ToString（TagRenderMode.Normal）；
datePicker.ToString（TagRenderMode.Normal）；
datePicker.InnerHtml+=inputAG+spanWrapper.ToString（TagRenderMode.Normal）；
controlWrapper.InnerHtml+=datePicker.ToString（TagRenderMode.Normal）；
controlGroupWrapper.InnerHtml+=controlWrapper.ToString（TagRenderMode.Normal）；
返回MvcHtmlString.Create（controlGroupWrapper.ToString（TagRenderMode.Normal））；
}

只是一个提示：由于MVC4，您可以使用Html.IdFor和Html.NameFor，而不必使用ExpressionHelper