Very basic jquery datepicker in Razor

2019-08-03 12:47发布

站内问答 / jQuery
1399 1 6

I am in the visual studio 2010 MVC4 razor microsoft template. I downloaded the jquery "kit" from the jquery site and it works when I open up the index.html. However, when I change my razor project to look like the jquery download (move all the JS files, images, and css files into the right places) and add in the following code (which works in the html case)

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>jQuery UI Example Page</title>
    <link type="text/css" href="~/Content/ui-lightness/jquery-ui-1.8.24.custom.css" rel="stylesheet" />
    <script type="text/javascript" src="~/Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery-ui-1.8.24.custom.min.js"></script>
    <script type="text/javascript">
        $(function () {

            // Datepicker
            $('#datepicker').datepicker({
                inline: true
            });

        });
    </script>

</head>
<body>


    <!-- Datepicker -->
    <h2 class="demoHeaders">Datepicker</h2>
    <div id="datepicker"></div>


</body>

Nothing shows up on the page expect for the text Datepicker. I have looked through everything else and nothing seems to be doing the trick. Any suggestions?

1条回答
疯言疯语
2楼-- · 2019-08-03 13:24

Check the Network console in your browser, I bet it is getting 404 errors when it's trying to load your css and js files. Because of this, it doesn't apply the style for the calendar, or even the js to have it hidden initially and all that. Try referencing them this way:

<link type="text/css" href='@Url.Content("~/Content/ui-lightness/jquery-ui-1.8.24.custom.css")' rel="stylesheet" />
<script type="text/javascript" src='@Url.Content("~/Scripts/jquery-1.8.2.min.js")'></script>
<script type="text/javascript" src='@Url.Content("~/Scripts/jquery-ui-1.8.24.custom.min.js")'></script>

Using Url.Content will resolve your URLs correctly.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)