ASP.Net MVC 5中的Bootstrap DateTimePicker

我在ASP.Net中有一个带有MVC 5的Bootstrap模式,我用它来编辑FullCalendar javascript插件上的一个条目.

_Edit.cshtml:

@model Models.CalendarEntry


    ×
    
Edit Calendar Entry


@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    


        

            
@Model.Title
            

            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            @Html.HiddenFor(model => model.CalendarEntryId)
            @Html.HiddenFor(model => model.PostId)

            

                @Html.LabelFor(model => model.Title, htmlAttributes: new { @class = "control-label col-md-2" })
                

                    @Html.EditorFor(model => model.Title, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.Title, "", new { @class = "text-danger" })
                
            

            

                @Html.LabelFor(model => model.EntryDateTime, htmlAttributes: new {  @class = "control-label col-md-2" })
                

                    

                        @Html.EditorFor(model => model.EntryDateTime, new { htmlAttributes = new { @class = "form-control" } })
                        
                            
                        
                    
                    @Html.ValidationMessageFor(model => model.EntryDateTime, "", new { @class = "text-danger" })
                
            

            

                @Html.LabelFor(model => model.Length, htmlAttributes: new { @class = "control-label col-md-2" })
                

                    @Html.EditorFor(model => model.Length, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => model.Length, "", new { @class = "text-danger" })
                
            

            

                @Html.LabelFor(model => model.EntryStatus, htmlAttributes: new { @class = "control-label col-md-2" })
                

                    @Html.EnumDropDownListFor(model => model.EntryStatus, htmlAttributes: new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.EntryStatus, "", new { @class = "text-danger" })
                
            
        
    

    

        Cancel
        
    

    
}

出于某种原因,有两件事情发生,我无法弄清楚为什么.

首先,glyphicon-calendar它不在输入旁边:

其次,当模态窗体加载时,除了日期时间字段之外的所有其他字段都会填充数据,直到我单击日历字形,然后日期时间字段将填充当前日期和时间.模型中的值永远不会显示.

Web界面不是我的强项,我将不胜感激.

当您创建一个新的MVC项目时,它带有一个默认的css文件(Site.css),其中包含一些预定义的CSS样式.默认情况下,它将输入字段max-width定义为280px.这就是原因,您的输入组未按预期工作.

如果你删除/调整你的css类~/Content/Site.css,你的css问题将得到解决.