I am using jquery ui datepicker.and its working fine .my need is to set the date to the textbox when querystring contain any date

eg my url is localhost:301/?date=2013-12-01

so I want to set this date to input textbox.

my input box html is

<input type="text" id="datepicker" class="txt-cal hasDatepicker" name="addFromDate" date_name="2013-12-11">

I tried some thing but no result.

$(function () {

        var myDate = ?/*how to select the date_name from input textbox
        $('#datepicker').datepicker();
        $('#datepicker').datepicker('setDate', myDate);
        $('#datepicker2').datepicker();
        $('#datepicker2').datepicker('setDate', myDate);
        $('#datepicke3').datepicker();
        $('#datepicke3').datepicker('setDate', myDate);
        $('#datepicker4').datepicker();
        $('#datepicker4').datepicker('setDate', myDate);


    });

Thanks in advance

I am using jquery ui datepicker.and its working fine .my need is to set the date to the textbox when querystring contain any date

eg my url is localhost:301/?date=2013-12-01

so I want to set this date to input textbox.

my input box html is

<input type="text" id="datepicker" class="txt-cal hasDatepicker" name="addFromDate" date_name="2013-12-11">

I tried some thing but no result.

$(function () {

        var myDate = ?/*how to select the date_name from input textbox
        $('#datepicker').datepicker();
        $('#datepicker').datepicker('setDate', myDate);
        $('#datepicker2').datepicker();
        $('#datepicker2').datepicker('setDate', myDate);
        $('#datepicke3').datepicker();
        $('#datepicke3').datepicker('setDate', myDate);
        $('#datepicker4').datepicker();
        $('#datepicker4').datepicker('setDate', myDate);


    });

Thanks in advance

• javascript
• jquery
• jquery-ui
• datepicker

• Can you provide us with a jsfiddle? You should call .datepicker() first and then .datepicker('setDate', date) on it – RononDex Commented Dec 12, 2013 at 11:56
• jsfiddle/D9N6a/2 – Arun Commented Dec 12, 2013 at 12:01
• 2 Here you go: jsfiddle/D9N6a/3 – RononDex Commented Dec 12, 2013 at 12:04
• set your date format dateFormat : 'yy-mm-dd' then you can assign you date value – Ashok Maharjan Commented Dec 12, 2013 at 12:04

3 Answers 3

A better approach will be using custom data attribute.

data-date="2013-12-11"

Now you can access it

var myDate = $("#datepicker").data("date");
$('#datepicker').datepicker('setDate', myDate);

Update:

I doubt you're trying to get it from url(ie, query string)

If so check this answer, where a method is written to get

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

Now

var myDate = getParameterByName("date");

You need to use the .attr function:

var myDate = $("#datepicker").attr("date_name");

However, you should beware of creating non-standard HTML attributes

You can do this:

$('#datepicker1').datepicker({ orientation: 'top', format: 'dd-mm-yyyy' });

var currentDate = new Date();
var day = ((currentDate.getDate()).toString().length == 1) ? '0' + (currentDate.getDate()).toString() : (currentDate.getDate()).toString();
var month = ((currentDate.getMonth() + 1).toString().length == 1) ? '0' + (currentDate.getMonth() + 1).toString() : (currentDate.getMonth() + 1).toString();
var year = currentDate.getFullYear();
$("#datepicker1").val(day + '-' + month + '-' + year);

I have tried in text input control. It just needed to apply datepicker 1st then set the current date to textbox.