jQuery无法在cshtml上弹出对话框

Question

This is the editor for the startdate @Html.EditorFor(model => model.startDate) and I have jquery blow, the code for the query is on the page and when I run the program the calender pop up does not come up, both code are on the dame cshtml page

<meta charset="utf-8" />

  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
  <script>
  $(function() {
    $( "#startDate" ).datepicker();
  });
  </script>

Answer 1

Replace

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

with

@Html.EditorFor(model => model.startDate, new { @class="startDate" })

because you have not giveen a class to that field and change your jQuery to

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

so # becomes . as we are using a class.

Answer 2

You need to verify that all your external scripts loaded properly. I suggest you install Fiddler and then watch your requests and see if all of them loaded. If that all is ok then you need to check that the scripts actually load before your call for the datepicker function. If you're using MVC 4 and sections feature that would mean that all you javascript code needs to go into the SCRIPTS section which is placed on your view AFTER the calls to load jquery and jquery-ui libraries. Use Goggle Chrome's console to verify that there are no javascript errors.

Looking at the code you posted here everything should be working. I've done this millions of times and every time I had a problem it was because I was missing a JQuery library reference or I wasn't loading them in proper order.