how to Add a date picker with existing script?

Question

4.00/5 (1 vote)

See more:

My jquery code is :

XML

<script type="text/javascript" src="Scripts/jquery-1.4.2.min.js" >
    </script>

    <script type="text/javascript">
        $(function () {
            $('input:text:first').focus();
           
            var $inp = $('.cls');
            $inp.bind('keydown', function (e) {
               
                var key = e.which;
                if (key == 13) {

                    e.preventDefault();

                  
                    var nxtIdx = $inp.index(this) + 1;
                   
                    $(".cls:eq(" + nxtIdx + ")").focus();
                }
            });
        });

    </script>

if i want to add a date picker with it.how can i add?

Posted 23-Apr-14 22:28pm

Dew Drops

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Sampath Lokuge · Accepted Answer · 2014-04-24T00:14:00

Solution 1

Please try is as below.

XML

<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.10.2.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>

LIVE DEMO : JSFiddle

More info : Date Picker

Posted 24-Apr-14 0:14am

Sampath Lokuge

Updated 24-Apr-14 0:15am

v2

Comments

Dew Drops 25-Apr-14 12:36pm

thanks for your reply,but when i add the above code on my project then the date picker is not working. how can i make it as working?

Sampath Lokuge 26-Apr-14 0:14am

can you put your whole code snippet with related to the data picker ? This is very simple task.

Dew Drops 26-Apr-14 0:58am

Sampath Lokuge 26-Apr-14 1:01am

You have to add jquery UI also.Please check my answer.And try to use latest jquery versions rather than the very old ones which you use currently.

Dew Drops 26-Apr-14 2:18am

i'm trying with your code,but its working when i dont add my another scipt. but when i add the above script,then its not working :(

Sampath Lokuge 26-Apr-14 2:42am

What's your another script ?

Dew Drops 26-Apr-14 5:37am

my script is above...

Sampath Lokuge 26-Apr-14 6:52am

I couldn't see your jquery ui reference into your context ? without it,this will not work.

Dew Drops 27-Apr-14 1:51am

Sampath Lokuge 27-Apr-14 1:56am

Your order of the JS file is wrong.You must load the main js file first and then the UI library and so on.According to my example it should be like this.

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

Dew Drops 27-Apr-14 2:33am

thanks a lot,its working

Sampath Lokuge 27-Apr-14 2:48am

You're warmly welcome. :)

Dew Drops 27-Apr-14 2:58am

:)