In my application, users often need to go to +1 or -1 day from the current selected date. For this, I want to make this process more quick by adding two image buttons for +1 and -1 operation on the right side and the left side respectively.

I have tried this:

$('#date').datepicker('setDate', '-1');

But it always set the +1 date from the current date (that is today -1, not the -1 from the selected date).

How can I achieve this..??
Any help would be appreciable.

Tried Later:
function AddDays(arg) {
    var d = $('#date').datepicker('getDate');
    var d = new Date(d.getYear(), d.getMonth(), d.getDay() + arg);
    $('#date').datepicker('setDate', d);
}

And Calling this function as AddDays(1) and AddDays(-1) on onclick event of image but It produces very strage result.
For Example if I set the current date to 25-03-13 that is in dd-mm-y format then clicking on -1 button is setting the date to 28-02-0-87. Clicking it on again will result in no change. And clicking it third time will result 01-02-0-87.

I can't get the point. What kind of behavior is this..??

Dani AI

Generated

datepicker('setDate', '-1') uses a relative string that is always calculated from today, not from the widget’s currently selected date. That is why it ignores what is in the input. Also, the odd result you saw (e.g., 28-02-0-87) comes from mixing up getDay() (day of week, 0-6) with getDate() (day of month) and getYear() (offset from 1900). See the docs for getDate and getFullYear.

If you want inline, single-line handlers that move relative to the selected date (falling back to today if empty):

<button onclick="var d=$('#date').datepicker('getDate')||new Date(); d.setDate(d.getDate()+1); $('#date').datepicker('setDate', d); return false;">+1 day</button>
<button onclick="var d=$('#date').datepicker('getDate')||new Date(); d.setDate(d.getDate()-1); $('#date').datepicker('setDate', d); return false;">-1 day</button>

Notes:

  • setDate on a Date object correctly rolls across month/year boundaries and handles DST transitions better than adding milliseconds.
  • If you use minDate/maxDate, you can clamp after computing the new date via var min=$('#date').datepicker('option','minDate'), max=... before calling setDate.
  • jQuery UI’s behavior is documented at datepicker('setDate') and explains why relative strings are today-based.

Recommended Answers

All 2 Replies

getFullYear()

Look at this please: http://stackoverflow.com/questions/563406/add-days-to-datetime-using-javascript

Also use getFullYear(), not getYear()

http://www.w3schools.com/jsref/jsref_obj_date.asp

Look at this please: http://stackoverflow.com/questions/563406/add-days-to-datetime-using-javascript

Also use getFullYear(), not getYear()

http://www.w3schools.com/jsref/jsref_obj_date.asp

Thanks stbuchok

Finally I have written my solution. Here is the code

function AddDays(arg) {
    var d = $('#date').datepicker('getDate');
    d.setDate(d.getDate() + arg);
    $('#date').datepicker('setDate', d);
}

Where date is the id of my jquery-ui datepicker.

I am still looking for any inline code (single line) that I can put directly in onclick event of my next and previous buttons.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.