CODEWITHSUNDEEP
javascriptjqueryasp.net-mvcasp.net-mvc-4datepicker
Marco Dinatsoli
Marco Dinatsoli

Reputation: 10590

using datepicker on mvc doesnt work

I would like to use the datepicker, i saw this simple page

http://jqueryui.com/datepicker/

i downloaded these tow jquery files

http://code.jquery.com/jquery-1.9.1.js and put it in GoogleDatePicker1.js

http://code.jquery.com/ui/1.10.3/jquery-ui.js and put it in GoogleDatePicker2.js

and i dowloaded this css file

http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css and put it in datePickerCSS.css

and i added these files to my project like this

@section scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/Scripts/functions.js")
    @Scripts.Render("~/Scripts/GoogleDatePicker1.js")
    @Scripts.Render("~/Scripts/GoogleDatePicker2.js")
}

@Styles.Render("~/css/datePickerCSS.css")

the functions.js is :

$(document).ready(function () {
    $(".datepicker").click(function () {
        datepicker();
    });
});

and my html is:

@Html.TextBoxFor(x => x.startDate, new { placeholder = "mm/dd/yyyy", @class = "datepicker" })

but when i click on this textbox, google chrome tells me that the datepicker is not defined.

i make an alert before the datepicker() function and it is working

any help?()

Upvotes: 2

Views: 2484

Answers (3)

Rasoul
Rasoul

Reputation: 187

You may want something like this:

$(function() {
  $(".datepicker").datepicker();
});

Upvotes: 0

user773423
user773423

Reputation:

You need to assign the datepicker to the element:

$(document).ready(function () {
    $(".datepicker").datepicker();
});

Upvotes: 2

David
David

Reputation: 219096

Where do you define the function datepicker() that you're trying to call?

It looks like you're using the plugin incorrectly. Consider the example in the documentation:

$(function() {
    $( "#datepicker" ).datepicker();
});

What you're trying to do is initialize the date picker when you click on it. This is incorrect. You should initialize it when the page loads, then the plugin itself will handle the click event. Something like this:

$(function() {
    $(".datepicker").datepicker();
});

Upvotes: 0

Related Questions