文章/答案/技术大牛

发布

社区首页 >问答首页 >jquery-ui-timepicker-addon MVC4没有附加到文本框的下拉列表

问jquery-ui-timepicker-addon MVC4没有附加到文本框的下拉列表
EN

Stack Overflow用户

提问于 2012-09-12 21:41:16

回答 1查看 2.6K关注 0票数 1

无法让jquery-ui-timepicker addon下拉菜单与MVC4框架一起工作。我正在尝试通过EditorTemplate连接时间选择器，以便将其附加到数据模型中所有可以为空的DateTime对象上。代码会到达脚本，但不会将下拉列表附加到文本框。如果有任何帮助，我们将不胜感激，因为我们已经努力了好几天。此示例代码：

模型

public class MyDateModel
    {

            [Key]
            public int Date_ID { get; set; }
            public DateTime? DATE_APPOINTMENT { get; set; }


    }

上下文

public class DateContext:DbContext
    {

        public DbSet<MyDateModel> MyDateModels { get; set; }

        protected override void OnModelCreating(DbModelBuilder modelBuilder)
        {

            modelBuilder.Conventions.Remove<PluralizingTableNameConvention>();

        }
    }

视图

@using (Html.BeginForm()) {

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>MyDateModel</legend>

        <div class="editor-label">

            @Html.LabelFor(model => model.DATE_APPOINTMENT)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.DATE_APPOINTMENT)

            @Html.ValidationMessageFor(model => model.DATE_APPOINTMENT)

        </div>

        <p>

            <input type="submit" value="Create" />

        </p>

    </fieldset>

EditorTemplates

DateTime.cshtml

@model Nullable<System.DateTime>

@if ( Model.HasValue ) {

   @Html.TextBox( "" , String.Format( "{0:MM-dd-yyyy HH:mm}" , Model.Value ) , new  { @class = "textbox" , @style = "width:400px;" } )

}
else {

   @Html.TextBox( "" , String.Format( "{0:MM-dd-yyyy HH:mm}" , DateTime.Now ) , new { @class = "textbox" , @style = "width:400px;" } )

}

@{

string name = ViewData.TemplateInfo.HtmlFieldPrefix;
string id = name.Replace( ".", "_" );
}
<script type="text/javascript">
    $(document).ready(function () {
        $("#@id").datetimepicker();
    });
</script>

从_Layout.cshtml调用脚本

<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/themes/base/css", "~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    <link href="../../Content/themes/base/jquery-ui-timepicker-addon.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-timepicker-addon.js" type="text/javascript"></script>
</head>
<body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title">@Html.ActionLink("Your logo here", "Index", "Home")</p>
            </div>
            <div class="float-right">
                <section id="login">
                    @Html.Partial("_LoginPartial")
                </section>
                <nav>
                    <ul id="menu">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        <li>@Html.ActionLink("About", "About", "Home")</li>
                        <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
    <div id="body">
        @RenderSection("featured", required: false)
        <section class="content-wrapper main-content clear-fix">
            @RenderBody()
        </section>
    </div>
    <footer>
        <div class="content-wrapper">
            <div class="float-left">
                <p>&copy; @DateTime.Now.Year - My ASP.NET MVC Application</p>
            </div>
            <div class="float-right">
                <ul id="social">
                    <li><a href="http://facebook.com" class="facebook">Facebook</a></li>
                    <li><a href="http://twitter.com" class="twitter">Twitter</a></li>
                </ul>
            </div>
        </div>
    </footer>

    @Scripts.Render("~/bundles/jquery")
    @RenderSection("scripts", required: false)
</body>

jquery

asp.net-mvc

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-09-18 00:17:20

所以我找到了答案。诀窍是在_Layou.cshtml中正确调用脚本。从正文中删除所有的脚本调用，并将它们放在头中。下面是可以工作的代码

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title - My ASP.NET MVC Application</title>
        <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <meta name="viewport" content="width=device-width" />
        @Styles.Render("~/Content/themes/base/css", "~/Content/css")
        @Scripts.Render("~/bundles/modernizr")
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/jqueryui")

    </head>
    <body>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title">@Html.ActionLink("Your logo here", "Index", "Home")</p>
                </div>
                <div class="float-right">
                    <section id="login">
                        @Html.Partial("_LoginPartial")

                    </section>
                    <nav>
                        <ul id="menu">
                            <li>@Html.ActionLink("Home", "Index", "Home")</li>
                            <li>@Html.ActionLink("About", "About", "Home")</li>
                            <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
                        </ul>
                    </nav>
                </div>
            </div>
        </header>
        <div id="body">

            @RenderSection("featured", required: false)
            <section class="content-wrapper main-content clear-fix">
                @RenderBody()
            </section>
        </div>
        <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p>&copy; @DateTime.Now.Year - My ASP.NET MVC Application</p>
                </div>
                <div class="float-right">
                    <ul id="social">
                        <li><a href="http://facebook.com" class="facebook">Facebook</a></li>
                        <li><a href="http://twitter.com" class="twitter">Twitter</a></li>
                    </ul>
                </div>
            </div>
        </footer>

        @RenderSection("scripts", required: false)
    </body>
</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/12389557

复制

相似问题

问jquery-ui-timepicker-addon MVC4没有附加到文本框的下拉列表
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery-ui-timepicker-addon MVC4没有附加到文本框的下拉列表EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery-ui-timepicker-addon MVC4没有附加到文本框的下拉列表
EN