MVC4 Eonasdan引导3日期时间选取doesn't打开选择器屏幕 [英] MVC4 Eonasdan Bootstrap 3 Date Time picker doesn´t open the picker screen

查看:169
本文介绍了MVC4 Eonasdan引导3日期时间选取doesn't打开选择器屏幕的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

I'm:

日期时间选择器自举3

我不能让采摘窗口中打开。当你点击文本框,什么都不会发生,没有消息显示在浏览器控制台(铬)。所以,说实话,控制工作作为一个简单的文本框,而不是作为一个日期时间选择器。

I can´t make the picking window open. When you click on the textbox, nothing happens and no messages are shown on browser Console (Chrome). So, in truth, the control is working as a simple textbox, not as a DateTime picker.

下面是我的code:

_layout包含在所有视图文件:

    <!DOCTYPE html>
<html lang="pt">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta charset="utf-8" />

    <title>TestApp</title>

    <link rel="shortcut icon" href="~/favicon.ico" type="image/x-icon" />
    <link rel="icon" href="~/favicon.ico" type="image/ico" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="@Url.Content("~/Content/bootstrap.css")" rel="stylesheet" media="screen">
    <link href="@Url.Content("~/Content/bootstrap-theme.min.css")" rel="stylesheet" media="screen">
    <link href="@Url.Content("~/Content/CustomNavBar.css")" rel="stylesheet" media="screen">
</head>

<body>

    <script src="@Url.Content("~/Scripts/jquery-2.0.3.min.js")"></script>
    <script src="@Url.Content("~/Scripts/bootstrap.min.js")"></script>

    <.... some other stuff here...>

Index.cshtml该网页上使用的:

<link href="@Url.Content("~/Content/bootstrap-datetimepicker.min.css")" rel="stylesheet" media="screen" type="text">

<script type="text/javascript" src="~/Scripts/moment.min.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap-datetimepicker.min.js"></script>


<div class="container">
    <div class="col-md-10">
        <div class='well'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

我AP preciate任何帮助,使这项工作...

I appreciate any help to make this work...

感谢您的帮助...

推荐答案

您布局可以清理一下,因为MVC4不再需要 @ Url.Content()虚拟路径。你可能也想看看捆绑的系统是如何工作的。对于某些,你正在做什么可能会与部分更好地工作:

Your layout can be cleaned up a bit, since MVC4 no longer requires @Url.Content() for virtual paths. You probably also want to look into how the bundling system works. For certain, what you're trying to do will probably work better with sections:

_Layout.cshtml:

<!DOCTYPE html>
<html lang="pt">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>TestApp</title>
        <link rel="shortcut icon" href="~/favicon.ico" type="image/x-icon" />
        <link rel="icon" href="~/favicon.ico" type="image/ico" />

        <link href="~/Content/bootstrap.css" rel="stylesheet" media="screen" />
        <link href="~/Content/bootstrap-theme.min.css" rel="stylesheet" media="screen" />
        <link href="~/Content/CustomNavBar.css" rel="stylesheet" media="screen" />

        @RenderSection("head", required: false)
    </head>

    <body>

        @RenderBody()

        <script src="~/Scripts/jquery-2.0.3.min.js"></script>
        <script src="~/Scripts/bootstrap.min.js"></script>

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

Index.cshtml:

@section head
{
    <link href="~/Content/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen" type="text" />
}

@section scripts
{
    <script src="~/Scripts/moment.min.js"></script>
    <script src="~/Scripts/bootstrap-datetimepicker.min.js"></script>
    <script>
        $(function () {
            $('#datetimepicker1').datetimepicker();
        });
    </script>
}

<div class="container">
    <div class="col-md-10">
        <div class='well'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</div>

使用节让视图引擎注入之类的东西&LT;脚本&GT; &LT;链接/&GT; 标签到布局的正确部分。无论 @RenderBody()发生在布局一节什么的不可以注射。

Using sections lets the view engine inject things like <script> or <link /> tags into the correct parts of the layout. Anything not in a section is injected wherever @RenderBody() occurs in the layout.

如果你想有一个更具体的例子,直奔来源:<一个href=\"http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx\" rel=\"nofollow\">http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx

If you want a more concrete example, go straight to the source: http://weblogs.asp.net/scottgu/archive/2010/12/30/asp-net-mvc-3-layouts-and-sections-with-razor.aspx

这篇关于MVC4 Eonasdan引导3日期时间选取doesn't打开选择器屏幕的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆