Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: MVC4
Hi,
i need a datepicker in the click of textbox.
 

Now i have written the following code:
 
In html:
 
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.css")" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/jquery-1.7.1.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-1.7.1.min.js"type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.8.20.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"></script>
 
<td><input type="text" id="datepicker" /></td>
 
In knockout.js:
 $(function () { $("#datepicker").datepicker(); });
 

But it is not working please guide me to do this.
 
Thank You
Posted 20-Aug-13 21:37pm
Edited 20-Aug-13 21:44pm
v3
Comments
Jameel M at 21-Aug-13 3:04am
   
why u are using knock out js for this?
Jameel M at 21-Aug-13 3:06am
   
please check the error in console.
Minnu Sanju at 21-Aug-13 3:07am
   
in my application i am using knockout.js
so i wrote the script for datepicker also in it
Minnu Sanju at 21-Aug-13 3:09am
   
i am using knockout.js in my application so i wrote the datepicker script also in it
Jameel M at 21-Aug-13 3:13am
   
for displaying a simple datepicker control why you are using knockoutjs?
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

Problems
 
1. You have included the jQuery files two times. Remove one.
<script src="../../Scripts/jquery-1.7.1.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-1.7.1.min.js"type="text/javascript"></script>
 
2. You have included jQuery UI js two times. Remove one.
<script src="../../Scripts/jquery-ui-1.8.20.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"></script>
 
3. You have included jQuery UI css two times. Remove one.
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.css")" rel="stylesheet" type="text/css" />
 
Solution
 
Refer - Datepicker[^]
Check what are the files included and how it is working. Try like below...
<!doctype html>
 
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/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>
  Permalink  
v3
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

  Permalink  
Comments
Minnu Sanju at 21-Aug-13 4:09am
   
i have tried this. Problem is that i when i use this in a view page it works. But i need the date picker in a partial view whick comes as popup.

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

  Print Answers RSS
0 OriginalGriff 7,105
1 DamithSL 5,079
2 Maciej Los 4,866
3 Sergey Alexandrovich Kryukov 4,617
4 Kornfeld Eliyahu Peter 4,384


Advertise | Privacy | Mobile
Web03 | 2.8.141223.1 | Last Updated 21 Aug 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100