why datepicker doesnt show on View?

Question

i have the following view with textbox attached with jquery datepicker, this shows the text box with DOB button next to it with datetime format label but when click button or click on the textbox it does not show the datepicker. How do i fix this?

@model dtTest.OrderTime

@{
    ViewBag.Title = "Edit";
}

<h2>Edit</h2>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>OrderTime</legend>

        @Html.HiddenFor(model => model.id)

        <div class="editor-label">
            @Html.LabelFor(model => model.TimeZone)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.TimeZone)
            @Html.ValidationMessageFor(model => model.TimeZone)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.TimeUTC)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.TimeUTC)
            @Html.ValidationMessageFor(model => model.TimeUTC)
        </div>

        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {

    @Scripts.Render("~/bundles/jqueryval")

    <script>
        $('document').ready(function () {
            $('#TimeUTC').datepicker({
                appendText: 'mm/dd/yyyy',
                showOn: 'both',
                buttonText: 'DOB',
                dateFormat: 'dd/dd/yy',
                changeMonth: true,
                changeYear: true,
                minDate: new Date(2000, 0, 1),
                maxDate: new Date(2005, 0, 1)
            });
        });
    </script>
}

my layout file adds the jqueryui bundle

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>@ViewBag.Title</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>
<body>
    @RenderBody()

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/jqueryui")

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

bundle files are:

    public class BundleConfig
    {
        // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.unobtrusive*",
                        "~/Scripts/jquery.validate*"));
}}

when i click the textbox the browser throws the following error in the console (chrome)

here is my scripts folder:

what error are you getting? please check your browser console. — Parth Trivedi, Dec 16 '15 at 10:08
@ParthTrivedi sorry for the delay when click in the textbox, this was the error "jquery-ui-1.8.20.js:8569 Uncaught TypeError: Cannot read property 'msie' of undefined" — Phill Greggan, Dec 16 '15 at 10:24
I believe you are using incompatible version of `jquery-ui` with your `jquery`. Which `jquery` version you are using? Also please have a look at : http://stackoverflow.com/questions/14923301/uncaught-typeerror-cannot-read-property-msie-of-undefined-jquery-tools — vijayP, Dec 16 '15 at 10:26
yes http://stackoverflow.com/questions/14923301/uncaught-typeerror-cannot-read-property-msie-of-undefined-jquery-tools?answertab=active#tab-top will help you. — Parth Trivedi, Dec 16 '15 at 10:27
just use this command in nuget package manager console `PM > Install-Package jQuery` — Parth Trivedi, Dec 16 '15 at 10:32
check http://stackoverflow.com/questions/25930568/how-to-get-latest-jquery-1-x-via-nuget-in-visual-studio?answertab=active#tab-top — Parth Trivedi, Dec 16 '15 at 10:35

score 1 · Accepted Answer · edited May 23 '17 at 12:04

1

In visual studio

Menu > TOOLS > Library and Package Manager > Package Manager Console

PM > Install-Package JQuery -Version Press Tab here to see all version here.

This update existing jQuery package and solve your problem with old jQuery version.

For more check How to get latest jQuery 1.x via Nuget in Visual Studio?

edited May 23 '17 at 12:04

Community

1
1

answered Dec 16 '15 at 10:38

Parth Trivedi

3,802
1
20
40

what are the libraries that typically used with MVC so i can DL and have them as a backup – Phill Greggan Dec 16 '15 at 10:39
i lost the css settings of teh datepicker and it shows as transparent control, is there a way to fix this? – Phill Greggan Dec 16 '15 at 10:41
Your Scripts folder. Just take whole backup. – Parth Trivedi Dec 16 '15 at 10:41
You have backup of folder? then find from that files. – Parth Trivedi Dec 16 '15 at 10:42

why datepicker doesnt show on View?

1 Answers1