user3386779
user3386779

Reputation: 7175

Calender in inputbox

I want to show datepicker in input box.4 days before This code show datepicker.Now I modified unknownly.I dont know What I changed.Here I attached my code

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
     <link rel="stylesheet" type="text/css" href="http://www.jscodes.com/codes/calendar_javascript/demo/css/datePicker.css" />
    <script src="http://www.jscodes.com/codes/calendar_javascript/demo/js/jquery-1.6.1.min.js" type="text/javascript"></script>
    <script src="http://www.jscodes.com/codes/calendar_javascript/demo/js/jquery.datePicker-min.js" type="text/javascript"></script>

    <title>Content Delv Logs</title>
     <script type="text/javascript">
        $(window).ready(function() {
            $('#date-pick').datePicker({clickInput: true});
        });
    </script>
</head>

<body>
        <input type="text" name="date" id="date-pick" value=""/>
</body>

Upvotes: 1

Views: 79

Answers (3)

Adnan Ahmed
Adnan Ahmed

Reputation: 686

Add this link in your head tag. You are missing jQuery UI library:

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>

Upvotes: 2

Tim
Tim

Reputation: 807

You just need to enable jQuery UI.

Have a look at this JSFiddle

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

Please note how jQueryUI is enabled.

Upvotes: 1

user4431269
user4431269

Reputation:

  $(function() {
    $( "#datepicker" ).datepicker();
  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<p>Date: <input type="text" id="datepicker"></p>

use jquery UI with alot of functions and more to give;;;

http://jqueryui.com/

http://jqueryui.com/datepicker/

Upvotes: 1

Related Questions