Click here to Skip to main content
15,893,486 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I loaded the following items for a jQuery datePicker
JavaScript
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.0.2/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.0.2/themes/ui-lightness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<script src="../Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script src="../Scripts/jquery.ui.datepicker.js" type="text/javascript"></script>
<script src="../Scripts/jquery.ui.core.js" type="text/javascript"></script>
<script src="../Scripts/jquery.ui.widget.js" type="text/javascript"></script>
<link href="../Content/themes/base/jquery.ui.base.css" rel="stylesheet" type="text/css" />

The datePicker dialog box pops up when I click the textbox. But it is totally transparent and has not frame. I guess I miss a script/css reference. Which one is missing? Appreciate your response.
Posted
Comments
Kornfeld Eliyahu Peter 27-Mar-14 9:13am    
I think it's a matter of order...
Move all your css references before any js, and put base.css to be first...
[no name] 27-Mar-14 9:18am    
Tried but still behaved the same.

So many references!!! My eyes are rolling. :rolleyes:

Refer - jQuery Datepicker[^].
Click on "View Source" link.
XML
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery UI Datepicker - Default functionality</title>

  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.9.1.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">

  <script>
      $(function() {
          $( "#datepicker" ).datepicker();
      });
  </script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>

</body>
</html>
 
Share this answer
 
Comments
[no name] 27-Mar-14 9:27am    
GREAT! I knew I overloaded something but also missed something. Yours is VERY clear and cute. Thanks.
Most welcome buddy. :)
Visit below link. On Create and Edit Popup jQueryUI DatePicker is used. You can download the code and can see how jQuery are referenced.

CRUD Operations using Partial View and jQueryUI in ASP.NET MVC4 - Part 2[^]

For creating DatePicker you need to write something like:
$("#enddatepicker").datepicker();
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900