javascript - jquery datepicker returns undefined value - Stack Overflow

Hi i m using datepicker to get the date. I had done the jquery datepicker but its returns undefined value. please help me.

HTML CODE

<input type="text" class="form-control fromdate" id="datepicker" name="from_date" placeholder="From date" value="<?php echo set_value('from_date'); ?>" >

script

var fromdate =  $('.fromdate').datepicker('getDate');
alert(fromdate);

Hi i m using datepicker to get the date. I had done the jquery datepicker but its returns undefined value. please help me.

HTML CODE

<input type="text" class="form-control fromdate" id="datepicker" name="from_date" placeholder="From date" value="<?php echo set_value('from_date'); ?>" >

script

var fromdate =  $('.fromdate').datepicker('getDate');
alert(fromdate);

• javascript
• jquery
• ajax

Share Improve this question Follow edited Apr 22, 2015 at 10:23 R3tep 12.9k1010 gold badges5151 silver badges7676 bronze badges asked Apr 22, 2015 at 10:22 Mukhila AsokanMukhila Asokan 64733 gold badges1313 silver badges3131 bronze badges 8

• When are you calling your script? On change? Click? Not on load I hope!!! Please show more of the page HTML/script. – iCollect.it Ltd Commented Apr 22, 2015 at 10:23
• i used Onchange event – Mukhila Asokan Commented Apr 22, 2015 at 10:24
• 1 Have you tried $('.fromdate').val()? – Rory McCrossan Commented Apr 22, 2015 at 10:25
• i used but it returns null – Mukhila Asokan Commented Apr 22, 2015 at 10:26
• 1 Please show the output HTML of the page (as saved from your browser). That will make identifying the problem easier. You may simply be missing jQueryUI etc. – iCollect.it Ltd Commented Apr 22, 2015 at 10:27

 |  Show 3 more ments

4 Answers 4

Sorted by: Reset to default 4

When you are using datepicker we need to initalize it first

<input type="text" class="form-control fromdate" id="datepicker" name="from_date" value="2015-4-10"   />

<script>
$(document).ready(function(){
    $('.fromdate').datepicker({
    dateFormat: 'yy-m-d',
    inline: true,
    onSelect: function(dateText, inst) { 
        var date = $(this).datepicker('getDate'),
            day  = date.getDate(),  
            month = date.getMonth() + 1,              
            year =  date.getFullYear();
        alert(day + '-' + month + '-' + year);
    }
});

var fromdate =  $('.fromdate').datepicker('getDate');
alert(fromdate);

});
</script>

When you are using a jQuery UI widget, you first have to instantiate the widget before calling any functions on it:

$(function() {
    //Instanciate the widget
    $( ".fromdate" ).datepicker();
    //Access to widget's functions
    alert($( ".fromdate" ).datepicker('getDate'))
});

jsFiddle

Note: $(function(){ YOUR CODE HERE }); is just a shortcut for $(document).ready(function(){ YOUR CODE HERE });

Without your full page/code this is guesswork, but using datepicker is pretty simple. You need to "turn it on first", then use it:

$('.fromdate').datepicker({
    onSelect: function (dateText) {
        var fromdate = $('.fromdate').datepicker('getDate');
        alert(fromdate);
    }
});

JSFiddle: http://jsfiddle/TrueBlueAussie/zr9ewogp/1/

You example seemed odd as the onSelect event passes the date value, so fetching it is not actually needed:

e.g.

$('.fromdate').datepicker({
    onSelect: function (dateText) {
        alert(dateText);
    }
});

1. How to set QueryString in jQuery:

var type="DataType";
window.location.href = `../../DashBoard/Index?Type=${type}`;

2. How to get QueryString in jQuery:

const queryString = new URLSearchParams(window.location.search);
const type = queryString.get('Type');