willdanceforfun
willdanceforfun

Reputation: 11240

Why doesn't my simple jquery UI date script setDate properly?

I have made a little script for a payment schedule.

On clicking a button, an input is generated. This input is a date selector input from the jquery ui framework.

On selecting the date for the first input, if another input is generated, the starting date would be the previous date, plus 1 day.

So far I have got about half of this working, but it seems my setDate option is not working as planned.

If you look at the following jsfiddle you can see what is and isn't working so far.

Here is the jquery code at a glance:

$('#add_payment_schedule_button').live('click',function(){

    // get number of schedule date inputs already...
    var schedule_count = $('.payment_schedule_date_wrap').length;


    // get previous date if there is more than 1 date box already
    if(schedule_count > 0) 
    {
        var previous_date = $('#payment_schedules input.date:last').val();
        alert(previous_date);
    }

    // the new input var for insertion
    var payment_schedule = '<div class="payment_schedule_date_wrap"><input type="text" name="date['+schedule_count+']" class="date date_'+schedule_count+'" placeholder="..." /></div>';


    // insert the new input into the scope
    $('#payment_schedules').append(payment_schedule);


    // load the date picker...
    $('input.date_'+schedule_count).datepicker({ dateFormat: 'dd-mm-yy', setDate: previous_date});


});

As you can see from the example, if you select the datepicker, choose a date, then add another schedule input, the alert function displays the date you just picked. But it doesn't insert it into the new datepicker.

Am I doing the selector wrong? What aren't I seeing?

And how can I go about simply adding 1 day to the previous_date var?

Thanks for your time.

Upvotes: 1

Views: 119

Answers (2)

JakeJ
JakeJ

Reputation: 1381

The problem is so far as I can see, is that you are setting the previous_date variable inside an if statement. If a variable is in an if statement, it can only be accessed from within that statement. This should work.

It also will create a date without a val if there is no dates (Just a validation check)

$('#add_payment_schedule_button').live('click',function(){

    // get number of schedule date inputs already...
    var schedule_count = $('.payment_schedule_date_wrap').length;


    // get previous date if there is more than 1 date box already
var previous_date = "";
if(schedule_count > 0) 
{
    previous_date = $('#payment_schedules input.date:last').val();
    alert(previous_date);
}

// the new input var for insertion
var payment_schedule = '<div class="payment_schedule_date_wrap"><input type="text" name="date['+schedule_count+']" class="date date_'+schedule_count+'" placeholder="..." /></div>';


// insert the new input into the scope
$('#payment_schedules').append(payment_schedule);


// load the date picker...
if(previous_date == "")
{
    $('input.date_'+schedule_count).datepicker({ dateFormat: 'dd-mm-yy' });
}
else
{
    $('input.date_'+schedule_count).val(previous_date).datepicker({ dateFormat: 'dd-mm-yy' });
}

});
});

EDIT: Just fixed a duplicate variable declaration issue

EDIT: I think I just fixed it

Upvotes: 1

wroniasty
wroniasty

Reputation: 8052

Actually 'setDate' is a datepicker method, not an option.

 $('input.date_'+schedule_count).datepicker({ 
     dateFormat: 'dd-mm-yy'
 }).datepicker ('setDate', previous_date);

Should work.

Upvotes: 3

Related Questions